下面代码实现的功能:
v-for遍历下的元素,点击哪一个就给哪一个添加changeCollect下的样式,如果已经添加了样式,再点击就取消样式。
点击下一个时,点击过的样式不会消失,类似于多选
1、template代码
<li :class="{changeCollect:isCollect[index]}" @click="changeCollect(index)"></li>
2、script代码
data(){
return{
isCollect:localStorage.collect?JSON.parse(localStorage.collect):[]
}
},
methods:{
changeCollect:function(index){
if(this.isCollect[index]){
this.$set(this.isCollect,index,false)
}else{
this.$set(this.isCollect,index,true)
}
localStorage.collect = JSON.stringify(this.isCollect)
}
}