微客导航 » 文章资讯 » vue 全选与反选的实现方法(无Bug 新手看过来)

vue 全选与反选的实现方法(无Bug 新手看过来)

2023-09-16 14:03:05 147

我就废话不多说，直接上代码吧！





Document






{{item.name}}



全选

varvm=newVue({ el:"#app", data:{ proData:[ { "name":"张三" },{ "name":"李四" },{ "name":"王五" },{ "name":"赵六" } ], selectArr:[], checked:false }, watch:{ selectArr(curVal){ if(curVal.length==this.proData.length){ this.checked=true }else{ this.checked=false } } }, methods:{ selectAll(event){ if(!event.currentTarget.checked){ this.selectArr=[]; }else{//实现全选 this.selectArr=[]; this.proData.forEach((item,i)=>{ this.selectArr.push(i); }); } } } })

如果有bug，请告知！

以上这篇vue全选与反选的实现方法(无Bug新手看过来)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。

返回顶部
3162201930
czq8825@qq.com

vue 全选与反选的实现方法(无Bug 新手看过来)

热门推荐

随机推荐