element Tree树形控件获取未全选父节点id和子节点id

• element ui Tree树形控件获取未全选父节点和子节点id

   

  Tree树形控件选中状态

   

  在做分配权限的时候如图选择了父节点的某些子节点，现在父节点是半选中状态，使用this.$refs.tree.getCheckedKeys()只能拿到当前的子节点，子节点全选才能拿到父节点，而后台需要我们把父节点和子节点一起带过去。

  解决方法

    // 获取选中的子节点
    let checkedKeys = this.$refs.tree.getCheckedKeys();
    // 获取选中的父节点
    let hafCheckedKeys = this.$refs.tree.getHalfCheckedKeys();
    // 合并
    let functionIdList = checkedKeys.concat(hafCheckedKeys)
    然后再传给后台

  这样我们就解决了子节点未全选时拿到父节点id

   

  Tree树形控件回显问题

  解决了上一步你会发现回显的时候有问题，后台返回的数据中选有父节点id和子节点id就导致父节点直接全选
  

   

  解决办法

  //  先清空选中状态
   this.$refs.tree.setCheckedKeys([])
    functionIdList.forEach(i => {
           // 根据id 拿到 Tree 组件中的node的所有信息
          let node = this.$refs.tree.getNode(i);
          // node.isLeaf：判断当前节点是否为子节点
          if (node.isLeaf) {
               //如果是子节点，就把状态设置成选中
            this.$refs.tree.setChecked(node, true);
          } else {
  
          }
    })
    //functionIdList是设置选中的数据

  原文链接：https://blog.csdn.net/green111111112/article/details/112371860