[新增] tab 选项卡组件
This commit is contained in:
@@ -1,7 +1,10 @@
|
||||
::: demo
|
||||
|
||||
<template>
|
||||
<lay-tab></lay-tab>
|
||||
<lay-tab v-model="current1">
|
||||
<lay-tab-item title="选项一" id="1"><div style="padding:20px">选项一</div></lay-tab-item>
|
||||
<lay-tab-item title="选项二" id="2"><div style="padding:20px">选项二</div></lay-tab-item>
|
||||
</lay-tab>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -10,7 +13,10 @@ import { ref } from 'vue'
|
||||
export default {
|
||||
setup() {
|
||||
|
||||
const current1 = ref("1")
|
||||
|
||||
return {
|
||||
current1
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -21,7 +27,10 @@ export default {
|
||||
::: demo
|
||||
|
||||
<template>
|
||||
<lay-tab type="brief"></lay-tab>
|
||||
<lay-tab type="brief" v-model="current2">
|
||||
<lay-tab-item title="选项一" id="1"><div style="padding:20px">选项一</div></lay-tab-item>
|
||||
<lay-tab-item title="选项二" id="2"><div style="padding:20px">选项二</div></lay-tab-item>
|
||||
</lay-tab>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -30,7 +39,10 @@ import { ref } from 'vue'
|
||||
export default {
|
||||
setup() {
|
||||
|
||||
const current2 = ref("1")
|
||||
|
||||
return {
|
||||
current2
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -41,7 +53,10 @@ export default {
|
||||
::: demo
|
||||
|
||||
<template>
|
||||
<lay-tab type="card"></lay-tab>
|
||||
<lay-tab type="card" v-model="current3">
|
||||
<lay-tab-item title="选项一" id="1"><div style="padding:20px">选项一</div></lay-tab-item>
|
||||
<lay-tab-item title="选项二" id="2"><div style="padding:20px">选项二</div></lay-tab-item>
|
||||
</lay-tab>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -50,7 +65,10 @@ import { ref } from 'vue'
|
||||
export default {
|
||||
setup() {
|
||||
|
||||
const current3 = ref("1")
|
||||
|
||||
return {
|
||||
current3
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user