当前位置:网站首页>把el-tree选中的数组转换为数组对象

把el-tree选中的数组转换为数组对象

2022-07-06 06:04:00 不要睡觉哦i


问题:

el-tree根据数组对象的结构进行渲染,当我们勾选了想要的数据后只会生成一个数组


想要的效果:

把获取选中的数据(数组),根据父A下的子a的结构,进行父子级对应的数据结构转换


我的数据结构:

在这里插入图片描述


贴代码:直接复制,改一下变量名即可使用

<el-tree
     :data="collectionListData"
      show-checkbox
      node-key="id"
      @check="checkFn"
      ref="tree"
      :props="defaultProps">
 </el-tree>
 // 下面代码中出现的devices是我的子级数组数据,记得更改
checkFn(data, node) {
    
      let nodearr = [];
      if (!node.halfCheckedKeys.length) {
    
        node.checkedNodes.forEach((item) => {
    
          if (item.devices) {
    
            nodearr.push(item);
          }
        });
      } else {
    
        let nodeCheckedNodes = node.checkedNodes;
        let nodeHalfCheckedNodes = node.halfCheckedNodes;

        nodeHalfCheckedNodes.forEach((item) => {
    
          let assign = Object.assign({
    }, item);
          assign.devices = [];
          let childrenLength = item.devices;

          for (let i = 0; i < nodeCheckedNodes.length; i++) {
    
            if (nodeCheckedNodes[i].devices) {
    
              nodearr.push(nodeCheckedNodes[i]);
            } else {
    
              for (let j = 0; j < childrenLength.length; j++) {
    
                if (nodeCheckedNodes[i].id != childrenLength[j].id) {
    
                  continue;
                } else {
    
                  assign.devices.push(childrenLength[j]);
                }
              }
            }
          }
          nodearr.push(assign);
        });
      }
      this.nodeList = nodearr;
    },
原网站

版权声明
本文为[不要睡觉哦i]所创,转载请带上原文链接,感谢
https://blog.csdn.net/SYXZSs/article/details/124978712