vue-如何动态切换class
2018-11-13 本文已影响0人
梅格Drum
基础语法
vue讲的很详细在此不再叙述
<div id="app1">
<ul>
<li v-for="(item, index) in items" :class="{'active': isActive == index}" @click="handleActive(index)">{{ item }}</li>
</ul>
</div>
<script>
var app1 = new Vue({
el: "#app1",
data: {
items: ['q','w'],
isActive: 0
},
methods: {
handleActive: function(index) {
this.isActive = index;
}
}
});
</script>
着重理解v-bind:class是接受了一个对象,'active'是类名,第二个参数可以是一个表达式或者一个数据属性为boolean类型的值,如果为true则绑定class