elementUI tree动态渲染编辑时，选择父级时会全选所有的子级（回显时父节点和子节点都会被选中）

本文主要是介绍elementUI tree动态渲染编辑时，选择父级时会全选所有的子级（回显时父节点和子节点都会被选中），希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

效果：

解决方法

         <el-tree

                :data="systemTree"

                show-checkbox

                node-key="code"

                :check-strictly="systemNodeFlag"                

                @check-change="handelCheckChange"

                :props="defaultProps" ref="systemTree">

          </el-tree>

1.设置check-strictly 是一个变量systemNodeFlag 默认值是false

2.拿到接口数据后：

     this.systemNodeFlag = true  //重点：给数节点赋值之前 先设置为true

     this.$nextTick(() => {
        this.checkedSystem//拿到接口数据，筛选出选中状态的数据添加到数组中
        this.$refs.systemTree.setCheckedKeys(this.checkedSystem) //给树节点赋值
        this.checkStrictly = false //重点： 赋值完成后 设置为false
      })

名词解释：

很多同学拿到数据后只是进行了setCheckedNodes赋值，所以会出现父节点和子节点都被选中都情况

check-strictly：在显示复选框的情况下，是否严格的遵循父子不互相关联的做法，默认为 false

这篇关于elementUI tree动态渲染编辑时，选择父级时会全选所有的子级（回显时父节点和子节点都会被选中）的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---