Vue点击动态添加Class

2020-03-12  本文已影响0人  Cherry丶小丸子

1

<div id="app">
    <ul>
        <li v-for="(item, index) in todos" v-on:click="addClass(index)" v-bind:class="{ activeClass : index==current}">{{ item.name}}</li>
        </ul>
</div>
addClass:function(index){
    this.current=index;
}

2

<el-button size="mini" @click="clickBadge(1)"  :class="{activeBadge : 1 == activeBadge }">查看全部</el-button>
<el-button size="mini" @click="clickBadge(2)"  :class="{activeBadge : 2 == activeBadge }">任务</el-button> 
<el-button size="mini" @click="clickBadge(3)"  :class="{activeBadge : 3 == activeBadge }">需求</el-button>
<el-button size="mini" @click="clickBadge(4)"  :class="{activeBadge : 4 == activeBadge }">缺陷</el-button>
clickBadge(num){
    this.activeBadge = num
}
上一篇下一篇

猜你喜欢

热点阅读