html代码
<ul class="box">
<li v-for="c,index of cities" :class="{checked:arr.includes(index)}" @click="checkedBox(index)">{
{c}}</li>
</ul>
js代码
var app = new Vue({
el : ".box",
data : {
cities : ["上海","北京","广州","重庆","西安"],
arr : []
},
methods :{
checkedBox(i){
if(this.arr.includes(i)){
//includes()方法判断是否包含某一元素,返回true或false表示是否包含元素,对NaN一样有效
//filter()方法用于把Array的某些元素过滤掉,filter()把传入的函数依次作用于每个元素,然后根据返回值是true还是false决定保留还是丢弃该元素:生成新的数组
this.arr=this.arr.filter(function (ele){return ele != i;});
}else{
this.arr.push(i);
}
}
}
})