vue2 el-checkbox-group 复选框无法选中

最新推荐文章于 2024-07-13 09:39:33 发布

小果子^_^

最新推荐文章于 2024-07-13 09:39:33 发布

阅读量887

点赞数 1

分类专栏： Vue 文章标签：前端 javascript html

本文链接：https://blog.csdn.net/weixin_44021888/article/details/137511298

版权

Vue 专栏收录该内容

61 篇文章 6 订阅

订阅专栏

文章描述了在Vue2项目中使用el-checkbox-group组件时，如何修复复选框默认不选中的问题，通过使用Vue.set或$set方法确保新添加的属性能响应式更新。

摘要由CSDN通过智能技术生成

vue2 el-checkbox-group 复选框无法选中

原代码：

<template slot-scope="scope">
  <el-checkbox v-model="scope.row.bitian">必填</el-checkbox>
</template>

if (this.allTemplateList && this.allTemplateList.length > 0) {
  this.allTemplateList.forEach(template => {
    template.bitian = false;
    template.number = '';
    template.shangchuandatas = [];
    template.wenjiandaxiao = '';
  })
},

修改后：在遍历 this.allTemplateList 时，使用 Vue.set 或 this.$set 来确保新添加的属性是响应式的

if (this.allTemplateList && this.allTemplateList.length > 0) {  
  this.allTemplateList.forEach((template, index) => {  
    this.$set(this.allTemplateList, index, {  
      ...template,  
      bitian: false,  
      number: '',  
      shangchuandatas: [],  
      wenjiandaxiao: '',  
    });  
  });  
}