vue点击tab跳转页面,给点击的tab添加样式,且解决刷新以后点击的tab样式消失问题
<ul class="nij"> <li v-for="item in nav" @click="selectNav(item.title)"> <p :class="isSelect === item.title ? 'active' : ''">{{item.title}}</p> </li> </ul>
data:function(){
return{
nav: [
{title: 'senUs'},
{title: 'senGermany'},
{title: 'senFrance'},
{title: 'senUk'}
]
}
},
computed:{
isSelect:function(){
return this.$route.name;
}
},
methods:{ selectNav (title) { switch (title) { case 'senUs': this.$router.push('/sentiSectors/senUs') break case 'senGermany': this.$router.push('/sentiSectors/senGermany') break case 'senFrance': this.$router.push('/sentiSectors/senFrance') break case 'senUk': this.$router.push('/sentiSectors/senUk') break } } },
.nij{ p{ line-height:30px; } } .active{ color: #ffd100; }