web建站教程
  1. 首页
  2. vuejs
  3. js
  4. 好玩
  5. AIGC工具
  6. 前端知识
  7. 百度echarts
  8. 更多
    php入门
    nodejs
    mockjs
    reactjs
    mysql
    wordpress
    织梦cms
    帝国cms
    git教程
    IT知识
    模板大全
    休息站
    手机应用

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

1005 ℃

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是所有数据
},
Trae:新一代免费的AI编程工具

利用纯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
本文共计602个字,预计阅读时长5分钟
生活小工具,收录了80多款小工具
上一篇: 一键生成脚本与分镜,激发无限创意的一款AI故事生成助手——OneStory
下一篇: 一款专注于语音合成和音色克隆服务的AI语音工具——MiniMax Audio
x 打工人ai神器