el-checkbox点击全选后再点击单选全部被取消,再点击单选有全部被选中,有可能是你点击全选的时候赋值出错了,下面是解决方法!
el-checkbox多选、全选代码如下:
<el-checkbox-group v-model="rulesCheck" @change="handleCheckChange">
<el-checkbox
v-for="(item, index) in ruleBox.rulesList"
:label="item"
:key="index"
style="width: 100%">{{ item }}
</el-checkbox>
</el-checkbox-group>
<el-checkbox
:indeterminate="isIndeterminate"
v-model="checkAll"
@change="handleCheckAllChange">全选
</el-checkbox>
js代码
handleCheckAllChange(val) {
this.rulesCheck = val == true ? this.rulesList : [];
this.isIndeterminate = false;
//注意val不是选中的值,是boolean类型true/false;
//this.rulesCheck放选中的数组,出现问题的同学有可能把val赋值到这里了;
//this.rulesList是所有数据
},
以上是编程学习网小编为您介绍的“el-checkbox点击全选后再点击单选功能错乱解决方法”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
编程基础网
本文标题为:el-checkbox点击全选后再点击单选功能错乱解决方法
基础教程推荐
猜你喜欢
- uniapp改变底部安全区顶部手机信号时间电池栏颜色样式 2023-12-28
- HTML5添加禁止缩放功能 2022-09-16
- 如何使用百度地图API获取地理位置信息 2024-11-22
- 在苹果Mac中如何将html网页转成PDF文件? 2023-10-26
- CSS3改变浏览器滚动条样式 2024-01-07
- js中style.display=””无效的解决方法 2023-12-15
- CSS 模拟float实现center文字左右环绕图片的效果 2024-01-09
- 关于 byval 与 byref 的区别分析总结 2023-12-14
- 浅谈js键盘事件全面控制 2023-12-13
- vue.js实现会动的简历(包含底部导航功能,编辑功能) 2023-12-14
