Vue iview 将树形结构中的父子节点Node转换成新的树形结构

// 获取当前选中的所有父子节点(数组)
let sourceNodeList = this.$refs.tree.getCheckedAndIndeterminateNodes();

if (sourceNodeList.length > 0) {
    let result = this.translateDataToTree(JSON.parse(JSON.stringify(sourceNodeList)));
} else {
    this.$Message.warning({
        content: '请先选择要导出的资源'
    });
}

// 根据父子id数组转换成树形结构
translateDataToTree(data) {
    // 没有父节点的数据
    let parents = data.filter(value => value.parent == undefined || value.parent == null || value.parent == '#');
    // 有父节点的数据
    let childrens = data.filter(value => value.parent !== undefined && value.parent != null && value.parent != '#')
    //定义转换方法的具体实现
    let translator = (parents, childrens) => {
    // 遍历父节点数据
    parents.forEach((parent) => {
        // 遍历子节点数据
        childrens.forEach((current, index) => {
        // 此时找到父节点对应的一个子节点
        if (current.parent === parent.id) {
            // 对子节点数据进行深复制
            let temp = JSON.parse(JSON.stringify(childrens))
            // 让当前子节点从temp中移除,temp作为新的子节点数据,这里是为了让递归时,子节点的遍历次数更少,如果父子关系的层级越多,越有利
            temp.splice(index, 1)
            // 让当前子节点作为唯一的父节点,去递归查找其对应的子节点
            translator([current], temp)
            // 把找到子节点放入父节点的childResourceList属性中
            parent.childResourceList != null ? parent.childResourceList.push(current) : parent.childResourceList = [current]
            }
          })
        }
        )
      }
      translator(parents, childrens);
      return parents;
    }

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值