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点击全选后再点击单选功能错乱解决方法
基础教程推荐
猜你喜欢
- JavaScript函数this指向问题详解 2023-08-12
- vue语法中v-show和v-if有什么不同 2025-01-19
- CSS经典实用技巧18招 2022-10-16
- 有趣的css实现隐藏元素的7种思路 2024-04-26
- javascript获取当前时间有哪些节假日(常见国内国际节日和其他纪念日) 2025-01-15
- uniapp打包app提示通讯录权限问题,如何取消通讯录权限 2022-10-29
- 用ajax实现预览链接可以看到链接的内容 2024-04-06
- 解决方案:uni-app非nvue模式下切换主题后,App端闪屏、闪白、闪黑、状态栏主题色不稳定 2023-10-08
- 移动端开发1px线的理解与解决办法 2024-04-02
- 纯CSS实现网页内部锚点跳转时上下偏移的示例代码 2023-12-22