代码思路
通过改变列表的复选框的状态,拿到选中的个数,根据个数来和数据的总长度进行比较
如果数量相同则选中全选框,不相等则不选中
具体代码
事件:
ckbtn(i){ // i代表选中的列表的下标
this.$store.commit('radio',i)
}
vuex代码:
radio(state,data){
state.list[data].checkbox = !state.list[data].checkbox//让列表的复选框选中
let arr = state.list.filter((item) => { //将数组里面选中的数据return返回给arr
return item.checkbox
});
if(arr.length == state.list.length){//判断arr的长度是否等于state.list数据的长度
state.all = true//如果长度相等则让全选框选中
}else{
state.all = false//不相等则不选中
}
localStorage.setItem('lists',JSON.stringify(state.list))//重新存储一遍
}
以上就是本节的内容,希望能帮到你,以后也会持续更新更多内容,想了解更多看我主页,谢谢观看!