Tab 标签页

文档: https://vant-contrib.gitee.io/vant/#/zh-CN/tab

使用逻辑与 Sidebar 一致. 基本可以理解为, 一个是横向布局, 一个是竖向布局.

涉及组件: Tabs 和 Tab, 基本用法:

<van-tabs v-model:active="active">
	<van-tab title="...">内容</van-tab>
  <van-tab title="...">内容</van-tab>
</van-tabs>

不同于 Sidebar, Tab 中可以自定义很多内容.

常用属性等:

• 默认 Tabs 绑定索引. 如果 Tab 使用 name 属性, Tabs 绑定也可以是 name 值.
• 当 Tab 超过 5 个时, 会呈现滚动.
• Tabs 默认为 line 风格, 也可以切换为 type="card".
• Tabs 可以绑定 click-tab 事件, 来响应不同 Tab 的点击响应.
• 让 Tabs 吸附于顶部. 只需要使用 sticky 属性即可.
• 收缩布局, 让 tab 集体左靠, 使用 shrink 属性.
• 使用 Tab 组件的 title 插槽可以自定义标签.
• 切换动画使用 animated 属性.
• 使用 swipeable 支持滑动切换.
• scrollspy 滚动导航, 逻辑上类似于 IndexBar.
• 使用 before-change 函数, 可以在切换前请求数据 (利用 Promise).
• showHeader 控制 Tabs 的标题栏是否显示.