element tree 树形数据的一些操作方法

子节点查找所有父节点
 // 子节点查找所有父节点
    findPatentValue (array, targetId, valueKey, childrenKey) {
      if (!targetId || !Array.isArray(array)) return [];
      const result = [];
      let valid = false;
      const seek = (_array, _targetId) => {
        let parentValue = '';
        const up = (_array_, _targetId_, lastValue) => {
          _array_.forEach((v) => {
            const val = v[valueKey];
            const child = v[childrenKey];
            if (val === _targetId_) {
              valid = true;
              parentValue = lastValue;
              return;
            }
                child?.length && up(child, _targetId_, val);
          });
        };
        up(_array, _targetId);
        if (parentValue) {
          result.unshift(parentValue);
          seek(_array, parentValue);
        }
      };
      seek(array, targetId);
      return valid ? [...result, targetId] : [];
    },
树扁平化
    treeToFlat (treeList, flatList) {
      // flatList.length > 9999 是考虑底线保护原则,出于极限保护的目的设置的,可不设或按需设置。
      if (flatList.length > 9999) {
        return;
      }

      // eslint-disable-next-line array-callback-return
      treeList.map((e) => {
        e.value = e.label;
        flatList.push(e);

        // 递归:有条件的自己调用自己,条件是 e.children.length 为真
        if (e.children && e.children.length) {
          this.treeToFlat(e.children, flatList);
        }
      });

      // console.log('扁平化后:', flatList)
      return flatList;
    },
给树添加深度属性
arrayTreeAddLevel (array, levelName = 'level', childrenName = 'children') {
      if (!Array.isArray(array)) return []
      const recursive = (array, level = 0) => {
        level++
        return array.map(v => {
          v.visible = true
          v[levelName] = level
          const child = v[childrenName]
          if (child && child.length) recursive(child, level)
          return v
        })
      }
      return recursive(array)
    },
判断同级结点下是否有重复数据
judgeSameLabel(list) {
    let flag = false
    // 设立单独的标识用于中断递归函数
    const recursion = list => {
        if (flag) return false
        for (let i = 0; i < list.length; i++) {
            for (let j = i + 1; j < list.length; j++) {
                if (list[i].label === list[j].label || list[i].value === list[j].value) {
                    flag = true
                }
            }
            if (list[i].children && list[i].children.length !== 0) {
                recursion(list[i].children)
            }
        }
    }
    recursion(list)
    return flag
}
根据id查找树结构中的某一项
根据id查找树结构中的某一项
findItemById(list, id) {
    let target = null
    const recursion = list => {
        if (target) return false
        list.forEach(item => {
            if (item.id === id) {
                target = item
            } else if (item.children && item.children.length !== 0) {
                recursion(item.children)
            }
        })
    }
    recursion(list, id)
    return target
}
级联数组删除空children数据

场景:element-ui 级联选择器的如果删除了子项导致子项为空数组,会出现子项选不中的情况

filterEmptyChildren(list) {
    for (let i = 0; i < list.length; i++) {
        const item = list[i]
        if (item.children && item.children.length == 0) {
            item.children = undefined
        } else if (item.children && item.children.length !== 0) {
            this.filterEmptyChildren(item.children)
        }
    }
}
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值