vue的checkbox的全选反选

835 阅读1分钟

思路:

全选

当全选把全选时的数组赋值给选择状态数组\

取消全选

全选 把空数组赋值给状态数组\

如何当都选上了时全选按钮也勾选上

监听选择状态数组的长度当数组的长度满足时把改变全选多选框的状态为true
监听选择状态数组的长度当数组的长度不满足时把改变全选多选框的状态false

反选

当一个都没选的时候点击反选

调用全选的方法

当一都选上的时候点击反选

调用取消全选的方法

当选了一部分的时候点击反选

把全选时的数组和现在选择上数组比较 去他们的交集

uTools_1651410523916.png

全选和取消全选方法

uTools_1651410592096.png

反选方法

uTools_1651410619878.png

监听数组变化 判断全选和取消全选是否勾上

uTools_1651410656965.png