住房建设部官方网站专家注册,软件公司招聘最新信息,商家管理系统,网址建立快捷方式先看效果图
全选#xff1a; 没有选中时#xff1a; 选中部分#xff1a;
作者项目使用的是vue3写法#xff0c;如果是vue2的自己转换一下
html代码#xff1a;
js代码#xff1a;
拓展
另一种方法#xff0c;如果不想使用勾选框#xff0c;可以试试下面的方…先看效果图
全选 没有选中时 选中部分
作者项目使用的是vue3写法如果是vue2的自己转换一下
html代码
js代码
拓展
另一种方法如果不想使用勾选框可以试试下面的方法 还是推荐第一种写法比较简单如果使用这种的可以参考一下思路是这样的
const selectAll () {form.fileTypes []if (form.fileTypes.length fileTypeList.length) {fileTypeList.map((item) {form.fileTypes.push(item.name)})form.fileTypes.unshift(全选)} else {form.fileTypes []}
}const changeSelect (val) {if (!val.includes(全选) val.length fileTypeList.length) {form.fileTypes.unshift(全选)} else if (val.includes(全选) (val.length - 1) fileTypeList.length) {form.fileTypes form.fileTypes.filter((item) {return item ! 全选})}
}const removeTag (val) {if (val 全选) {form.fileTypes []}
}
