tab切换样式改变
<template>
<div @click="cur=0" :class="[cur==0? 'nav-userh':'nav-user']">数据统计</div>
<div @click="cur=1" :class="[cur==1? 'nav-userh':'nav-user']">用户总人数</div>
<div class="tab-content">
<div v-show="cur==0">内容一</div>
<div v-show="cur==1">内容二</div>
</div>
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue'
export default defineComponent({
setup () {
const cur = ref(1)
return { cur }
}
})
</script>
<style scoped lang="less">
.nav-userh {
color: red;
}
.nav-user {
color: blue;
}
.tab-content{
width: 100px;
height: 100px;
border: 1px solid red;
}
</style>
本文来自博客园,作者:zjxgdq,转载请注明原文链接:https://www.cnblogs.com/zjxzhj/p/14736041.html