[antd of vue] a-tree组件子节点不完全勾选获取

转载自 [废柴码农(是个小姐姐)] ==>https://www.jianshu.com/p/207cafcfb390
这位小姐姐的是 react 版

于是我参考着改了一点点,记录一下,写得不好,仅供参考, 见谅~

        <a-tree
        showLine
        checkable
        @check="onBusinessSelectChange"
        :treeData='businessData'
        :checkedKeys="businessSelectedRowKeys"
        :autoExpandParent="true"
        >
        </a-tree>

---------------data中-------------------

data(){
  return{
      test: [],
      businessData: [],
      businessSelectedRowKeys: [],
      allSelectedNodes: [],
  }
}

------------------methods---------------------

  onBusinessSelectChange(selectedKeys, info) {
      // console.log('selectedKeys changed: ', selectedKeys);
      // console.log('info changed: ', info);

      // 已勾选子节点以及半勾选状态的父节点
      this.allSelectedNodes = selectedKeys.concat(info.halfCheckedKeys);
      this.businessSelectedRowKeys = selectedKeys;
    },

引用小姐姐的一段话

但是，（又敲黑板！！！）我们给后台传过去了父节点，如果有反显的情况下(如：修改，查看功能)，一旦有父节点，子节点又将会全部勾选！！这种情况下又该怎么办呢？

思路如下：
1.循环遍历出最深层子节点，存放在一个数组中
2.将后台返回的含有父节点的数组和第一步骤遍历的数组做比较
3.如果有相同值，将相同值取出来，push到一个新数组中
4.利用这个新的重组的数组给Tree组件selected赋值

// 1.循环遍历出最深层子节点，存放在一个数组中
getTreeChildren(data){
      data&&data.map(item=>{
        if(item.children && item.children.length > 0){
          this.getTreeChildren(item.children);
        }else{
          this.test.push(item.key);
        };
        return null;
      });
      return this.test;
    },
  // 2.将后台返回的含有父节点的数组和第一步骤遍历的数组做比较
  // 3.如果有相同值，将相同值取出来，push到一个新数组中
    compareItem(all_data,child_data){
      let uniqueChild = [];
      for(var i in child_data){
        for(var k in all_data){
          if(all_data[k] === child_data[i]){
            uniqueChild.push(all_data[k]);
          }
        }
      }
      return uniqueChild;
    },
    handleOpenEdit(record,operationType) {
      this.current.userCname = record.userCname;
      this.current.userCode = record.userCode;
      if(operationType === '业务权限配置'){
        this.visibleBusinessModal = true;
        this.businessSelectedRowKeys = [];
        queryUserMakeComInfo(this.current).then(res => {
          if(res.status == 0){
            this.businessData = [];

            this.businessData = this.getRootList(res.data.userpermitdatalist);
          }
          res.data.userpermitdatalist.forEach((el,index) => {
            if(el.flag == 1){
              this.businessSelectedRowKeys.push(el.comCode)
            }
          });
          this.businessSelectedRowKeys = this.compareItem(this.businessSelectedRowKeys,this.getTreeChildren(this.businessData));
        });
      }
    }