vue+ElementUI 级联选择器根据最后一级选中的值回显整个选中的数组

需求： 点击树形结构的最后一级获取到对应的值（id——也可以是是其他属性),需要在编辑弹窗中的级联选择器上显示整个的路径

弹窗

html

data

 orgListArr: [],
  optionProps: {
        label: 'deptName',
        value: 'id',
        children: 'children',

        checkStrictly: true, // 取消关联可以选择任意一级
  },

orgListArr 接口返回的

根据id 获取组织的完整路径 

getPath方法需要两个参数：  1.treeData表示用于提供级联选择器选择的数组； 2.targetId表示之前选中的数组的最后一级的值； 3.方法中的certNo表示级联选择器value值的键名

就是 value 绑定的属性名   返回的path数组即为我们需要的完整路径

    // 根据最后一级选中的值回显整个选中的数组  即通过最后一级的id 获取整个路径的数组
    getPath(treeData, targetId) {
      console.log(221, treeData, targetId);
      let path = [];
      let toggle = false;

      for (let i = 0; i < treeData.length; i++) {
        let item = treeData[i];
        path.push(item.id);
        if (item.id === targetId) {
          toggle = true;
          break;
        } else {
          if (item.children) {
            toggle = this.findPath(item.children, targetId, path, toggle);
            if (!toggle) {
              path.pop();
            } else {
              break;
            }
          } else {
            path.pop();
          }
        }
      }

      if (toggle) {
        console.log(245, path);
        return path;
      } else {
        return [];
      }
    },
    findPath(nodes, targetId, path, toggle) {
      for (let i = 0; i < nodes.length; i++) {
        let item = nodes[i];
        path.push(item.id);
        if (item.id === targetId) {
          return true;
        } else {
          if (item.children) {
            toggle = this.findPath(item.children, targetId, path, toggle);
            if (toggle) {
              return toggle;
            } else {
              path.pop();
            }
          } else {
            path.pop();
          }
        }
      }
      return toggle;
    },

调用  

this.organizationNew = this.getPath(
        this.orgListArr,
        this.currenEditUser.deptId
      );