diff --git a/packages/vant/src/back-top/test/__snapshots__/demo-ssr.spec.ts.snap b/packages/vant/src/back-top/test/__snapshots__/demo-ssr.spec.ts.snap index 853e9e788..e03ce5976 100644 --- a/packages/vant/src/back-top/test/__snapshots__/demo-ssr.spec.ts.snap +++ b/packages/vant/src/back-top/test/__snapshots__/demo-ssr.spec.ts.snap @@ -2,6 +2,7 @@ exports[`should render demo and match snapshot 1`] = `
+
+
+
+
+
+
+
+
+
+
+
+
``` +### ShowTitle + +If showTitle is falthy, title will not be rendered. + +```html + + + titleless content {{ index }} + + +``` + ### Shrink In shrink mode, the tabs will be shrinked to the left. diff --git a/packages/vant/src/tab/README.zh-CN.md b/packages/vant/src/tab/README.zh-CN.md index beccba8de..5478b15bb 100644 --- a/packages/vant/src/tab/README.zh-CN.md +++ b/packages/vant/src/tab/README.zh-CN.md @@ -143,6 +143,18 @@ export default { > Tips: 如果页面顶部有其他内容，可以通过 offset-top 属性设置吸顶时与顶部的距离。 +### 无标题模式 + +通过 `showTitle` 属性可以不渲染tab头部标题。 + +```html + + + 无title内容 {{ index }} + + +``` + ### 收缩布局 通过 `shrink` 属性可以开启收缩布局，开启后，所有的标签会向左侧收缩对齐。 diff --git a/packages/vant/src/tab/test/__snapshots__/demo-ssr.spec.ts.snap b/packages/vant/src/tab/test/__snapshots__/demo-ssr.spec.ts.snap index a91d35fd2..d01b9bf83 100644 --- a/packages/vant/src/tab/test/__snapshots__/demo-ssr.spec.ts.snap +++ b/packages/vant/src/tab/test/__snapshots__/demo-ssr.spec.ts.snap @@ -5,6 +5,7 @@ exports[`should render demo and match snapshot 1`] = `
+
+
+
+
+
+
+
+
+
+
-
-
- -
-
-
-
-
- - - - - - - - -
-
-
-
-
-
- -
+ + +
+
+ +
+
+
+
+
+ + + + + + + + +
+
+
+
+
+
+ +
+
+
{ + const wrapper = mount({ + render() { + return ( + + Text + Text + Text + Text + Text + + ); + }, + }); + + await later(); + const tabs = wrapper.findAll('.van-tabs__wrap,.van-sticky'); + expect(tabs.length).toEqual(0); +}); + test('should call before-change prop before changing', async () => { const onChange = vi.fn(); const beforeChange = (name: number) => { diff --git a/packages/vant/src/tabs/Tabs.tsx b/packages/vant/src/tabs/Tabs.tsx index 602deaba8..a89608041 100644 --- a/packages/vant/src/tabs/Tabs.tsx +++ b/packages/vant/src/tabs/Tabs.tsx @@ -64,6 +64,7 @@ export const tabsProps = { color: String, border: Boolean, sticky: Boolean, + showTitle: truthProp, shrink: Boolean, active: makeNumericProp(0), duration: makeNumericProp(0.3), @@ -479,16 +480,20 @@ export default defineComponent({ return () => (
- {props.sticky ? ( - - {renderHeader()} - - ) : ( - renderHeader() + {props.showTitle && ( + <> + {props.sticky ? ( + + {renderHeader()} + + ) : ( + renderHeader() + )} + )}