element plus ,Tabs 标签页

[color=var(--prism-builtin)][color=var(--prism-builtin)][color=var(--prism-punctuation)]<template[color=var(--prism-punctuation)]> [color=var(--prism-builtin)][color=var(--prism-builtin)][color=var(--prism-punctuation)]<el-tabs [color=var(--prism-property)]v-model[color=var(--prism-selector)][color=var(--prism-punctuation)]=[color=var(--prism-punctuation)]"activeName[color=var(--prism-punctuation)]" [color=var(--prism-property)]class[color=var(--prism-selector)][color=var(--prism-punctuation)]=[color=var(--prism-punctuation)]"demo-tabs[color=var(--prism-punctuation)]" [color=var(--prism-property)]@tab-click[color=var(--prism-selector)][color=var(--prism-punctuation)]=[color=var(--prism-punctuation)]"handleClick[color=var(--prism-punctuation)]"[color=var(--prism-punctuation)]> [color=var(--prism-builtin)][color=var(--prism-builtin)][color=var(--prism-punctuation)]<el-tab-pane [color=var(--prism-property)]label[color=var(--prism-selector)][color=var(--prism-punctuation)]=[color=var(--prism-punctuation)]"User[color=var(--prism-punctuation)]" [color=var(--prism-property)]name[color=var(--prism-selector)][color=var(--prism-punctuation)]=[color=var(--prism-punctuation)]"first[color=var(--prism-punctuation)]"[color=var(--prism-punctuation)]>User[color=var(--prism-builtin)][color=var(--prism-builtin)][color=var(--prism-punctuation)]</el-tab-pane[color=var(--prism-punctuation)]> [color=var(--prism-builtin)][color=var(--prism-builtin)][color=var(--prism-punctuation)]<el-tab-pane [color=var(--prism-property)]label[color=var(--prism-selector)][color=var(--prism-punctuation)]=[color=var(--prism-punctuation)]"Config[color=var(--prism-punctuation)]" [color=var(--prism-property)]name[color=var(--prism-selector)][color=var(--prism-punctuation)]=[color=var(--prism-punctuation)]"second[color=var(--prism-punctuation)]"[color=var(--prism-punctuation)]>Config[color=var(--prism-builtin)][color=var(--prism-builtin)][color=var(--prism-punctuation)]</el-tab-pane[color=var(--prism-punctuation)]> [color=var(--prism-builtin)][color=var(--prism-builtin)][color=var(--prism-punctuation)]<el-tab-pane [color=var(--prism-property)]label[color=var(--prism-selector)][color=var(--prism-punctuation)]=[color=var(--prism-punctuation)]"Role[color=var(--prism-punctuation)]" [color=var(--prism-property)]name[color=var(--prism-selector)][color=var(--prism-punctuation)]=[color=var(--prism-punctuation)]"third[color=var(--prism-punctuation)]"[color=var(--prism-punctuation)]>Role[color=var(--prism-builtin)][color=var(--prism-builtin)][color=var(--prism-punctuation)]</el-tab-pane[color=var(--prism-punctuation)]> [color=var(--prism-builtin)][color=var(--prism-builtin)][color=var(--prism-punctuation)]<el-tab-pane [color=var(--prism-property)]label[color=var(--prism-selector)][color=var(--prism-punctuation)]=[color=var(--prism-punctuation)]"Task[color=var(--prism-punctuation)]" [color=var(--prism-property)]name[color=var(--prism-selector)][color=var(--prism-punctuation)]=[color=var(--prism-punctuation)]"fourth[color=var(--prism-punctuation)]"[color=var(--prism-punctuation)]>Task[color=var(--prism-builtin)][color=var(--prism-builtin)][color=var(--prism-punctuation)]</el-tab-pane[color=var(--prism-punctuation)]> [color=var(--prism-builtin)][color=var(--prism-builtin)][color=var(--prism-punctuation)]</el-tabs[color=var(--prism-punctuation)]> [color=var(--prism-builtin)][color=var(--prism-builtin)][color=var(--prism-punctuation)]</template[color=var(--prism-punctuation)]> [color=var(--prism-builtin)][color=var(--prism-builtin)][color=var(--prism-punctuation)]<script [color=var(--prism-property)]lang[color=var(--prism-selector)][color=var(--prism-punctuation)]=[color=var(--prism-punctuation)]"ts[color=var(--prism-punctuation)]" [color=var(--prism-property)]setup[color=var(--prism-punctuation)]> [color=var(--prism-keyword)]import [color=var(--prism-punctuation)]{ ref [color=var(--prism-punctuation)]} [color=var(--prism-keyword)]from [color=var(--prism-string)]'vue' [color=var(--prism-keyword)]import type [color=var(--prism-punctuation)]{ TabsPaneContext [color=var(--prism-punctuation)]} [color=var(--prism-keyword)]from [color=var(--prism-string)]'element-plus' [color=var(--prism-keyword)]const activeName [color=var(--prism-operator)]= [color=var(--prism-function)]ref[color=var(--prism-punctuation)]([color=var(--prism-string)]'first'[color=var(--prism-punctuation)]) [color=var(--prism-keyword)]const [color=var(--prism-function)]handleClick [color=var(--prism-operator)]= [color=var(--prism-punctuation)]([color=var(--prism-property)]tab[color=var(--prism-operator)]: TabsPaneContext[color=var(--prism-punctuation)], [color=var(--prism-property)]event[color=var(--prism-operator)]: Event[color=var(--prism-punctuation)]) [color=var(--prism-operator)]=> [color=var(--prism-punctuation)]{ console[color=var(--prism-punctuation)].[color=var(--prism-function)]log[color=var(--prism-punctuation)](tab[color=var(--prism-punctuation)], event[color=var(--prism-punctuation)]) [color=var(--prism-punctuation)]} [color=var(--prism-builtin)][color=var(--prism-builtin)][color=var(--prism-punctuation)]</script[color=var(--prism-punctuation)]> [color=var(--prism-builtin)][color=var(--prism-builtin)][color=var(--prism-punctuation)]<style[color=var(--prism-punctuation)]> [color=var(--prism-selector)].demo-tabs > .el-tabs__content [color=var(--prism-punctuation)]{ [color=var(--prism-property)]padding[color=var(--prism-punctuation)]: 32px[color=var(--prism-punctuation)]; [color=var(--prism-property)]color[color=var(--prism-punctuation)]: #6b778c[color=var(--prism-punctuation)]; [color=var(--prism-property)]font-size[color=var(--prism-punctuation)]: 32px[color=var(--prism-punctuation)]; [color=var(--prism-property)]font-weight[color=var(--prism-punctuation)]: 600[color=var(--prism-punctuation)]; [color=var(--prism-punctuation)]} [color=var(--prism-builtin)][color=var(--prism-builtin)][color=var(--prism-punctuation)]</style[color=var(--prism-punctuation)]>

https://element-plus.gitee.io/zh-CN/component/tabs.html#基础用法