vue导航栏点击切换样式

说明：导航栏点击后给对应tab标签增加背景色

HTML部分，颜色绑定class

<div class='upList' v-for="(item,index) in upNavList" :key="index" @click="change(index)" :class="{ backCol:current == index}"><nuxt-link :to='item.url' class='upTitle hover'>{{ item.title }}</nuxt-link></div>

CSS部分，点击tab显示背景色

.backCol{background: #02B8B8;}

JS部分，

//前提是必须引入vuejs哦！var vm = new Vue({el:"#wrap",data:{current: 0,upNavList:[{title: '企业服务',url: '/home/vipServe',},{title: '培训服务,url: '/home/vipServe'},{title: '线上展厅',url: '/home/vipServe'},{title: '会员服务',url: '/home/vipServe'},{title: '产业商城',url: '/home/vipServe'},],},methods:{ change(index){this.current=index;console.log(this.current)},} });