Skip to content
On this page

tabs切换组件

Element Plus Tabs Documentation

Hidden Title

基础用法:<s-tabs :options="navList"></s-tabs>

属性事件插槽简介

基础用法

尺寸

胶囊类型

chenghua主题

石景山主题

通常用法

Slots

Trigger click|hover

children 支持嵌套 el-tab-pane

other

addRemove

位置

可以通过 tab-position 设置标签的位置

标签一共有四个方向的设置 tabPosition="left|right|top|bottom"

属性

属性名说明类型默认值
modelValue当前激活 tabstring / number / boolean-
options标签页配置array[]
label标签标题字段名stringlabel
value标签值字段名stringvalue
subAttrs透传给 el-tab-pane 的属性object{}
trigger切换触发方式,支持 click / hoverstringclick
type标签类型,支持 capsule 和 Element Plus 原生 card / border-card 等类型string按内部组件或 Element Plus 对应属性
theme主题样式,支持 default / chenghua / shijingshandefault / chenghua / shijingshandefault
size尺寸,支持 small / default / largestringdefault

事件

事件名说明
update:modelValue当前激活 tab 变化时触发

插槽

插槽名说明
default自定义整个 tabs 内容
${value}自定义每个 tab-pane 内容,名称为选项值
${value}-label自定义每个 tab 标题区域

思云博智私有前端组件库