现成的vue移动端 点击tab 切换样式功能。需要的拿去根据自己的需求改一下样式
<template>
<div class="container">
<ul class="tab-list">
<li class="tab-li"
:class="actiove == index ?'Active' : '' "
v-for="(item,index) in list" @click="cutTabClick(index)"
>{
{item}}</li>
</ul>
</div>
</template>
<script>
export default {
name: "tab",
data(){
return{
list: ["全部", "招商供应", "招聘求职", "出租求租", "二手设备", "采购求购"],
actiove:0,
}
},
methods:{
cutTabClick(index){
// console.log(index);
this.actiove = index
}
}
}
</script>
.container{
width: 100%;
background: #FFFFFF;
font-family: PingFan