fix(Tabs): should not render line when have no tab (#10063)

This commit is contained in:
neverland 2021-12-18 11:56:13 +08:00 committed by GitHub
parent 56b210156e
commit f6a835721c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 17 additions and 27 deletions

View File

@ -121,27 +121,15 @@ exports[`should allow to set name prop 1`] = `
`;
exports[`should emit rendered event after tab is rendered 1`] = `
DOMWrapper {
"isDisabled": [Function],
"style": CSSStyleDeclaration {
"_importants": Object {},
"_length": 0,
"_onChange": [Function],
"_values": Object {},
},
"wrapperElement": <div
aria-labelledby="van-tabs-0"
class="van-tab__panel"
id="van-tab"
role="tabpanel"
style=""
tabindex="0"
>
Text
</div>,
}
<div id="van-tab"
role="tabpanel"
class="van-tab__panel"
tabindex="0"
aria-labelledby="van-tabs-0"
style
>
Text
</div>
`;
exports[`should not render empty tab 1`] = `

View File

@ -219,8 +219,6 @@ exports[`should render nav-bottom slot correctly 1`] = `
class="van-tabs__nav van-tabs__nav--line"
aria-orientation="horizontal"
>
<div class="van-tabs__line">
</div>
</div>
</div>
Nav Bottom

View File

@ -256,7 +256,7 @@ test('should emit rendered event after tab is rendered', async () => {
await later();
expect(onRendered).toHaveBeenCalledWith('a', 'title1');
expect(wrapper.find('.van-tab__panel')).toMatchSnapshot();
expect(wrapper.find('.van-tab__panel').html()).toMatchSnapshot();
const tabs = wrapper.findAll('.van-tab');
await tabs[1].trigger('click');

View File

@ -384,6 +384,12 @@ export default defineComponent({
/>
));
const renderLine = () => {
if (props.type === 'line' && children.length) {
return <div class={bem('line')} style={state.lineStyle} />;
}
};
const renderHeader = () => {
const { type, border } = props;
return (
@ -403,9 +409,7 @@ export default defineComponent({
>
{slots['nav-left']?.()}
{renderNav()}
{type === 'line' && (
<div class={bem('line')} style={state.lineStyle} />
)}
{renderLine()}
{slots['nav-right']?.()}
</div>
</div>