web建站教程
     
  1. 首页
  2. 前端UI组件库
  3. AI项目和框架
  4. AIGC工具
  5. 百度echarts
  6. 地图大全
  7. 前端知识
  8. 更多
    vuejs
    js入门
    php入门
    mysql
    wordpress
    织梦cms
    帝国cms
    git教程
    IT知识
    模板大全
    休息站
    AI应用

el-checkbox点击全选后再点击单选功能错乱解决方法

1205 ℃

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是所有数据
},

利用纯js实现表格全选功能

vue如何利用computed实现全选功能

el-table实现相同name可以多选否则单选

javascript实现checkBox单选

el-table 单项type="selection"出现数据错乱解决

标签: el-checkbox 代码错乱 全选 单选

上面是“el-checkbox点击全选后再点击单选功能错乱解决方法”的全面内容,想了解更多关于 vuejs 内容,请继续关注web建站教程。

当前网址:https://ipkd.cn/webs_2366.html

声明:本站提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请发送到邮箱:admin@ipkd.cn,我们会在看到邮件的第一时间内为您处理!

当前位置: 首页 > vuejs
Trae:新一代免费的AI编程工具

呱呱工具箱

一款免费的在线小工具,无需下载,打开即可使用!呱呱工具箱

在线育儿补贴计算器

快来看看你到底可以领到多少补贴!生活小工具
上一篇:
下一篇:
x 打工人ai神器