一只大白鹅蛋 2021-11-03 21:18 采纳率: 80%
浏览 165
已结题

json内容格式的转换,目的是为了使用el的树图组件



```javascript
    [
        [{
            label: 'a',
            selectt: [{
                valuee: '123'
            }],
            root: 1,
            R: 0,
            RR: -1
        }, {
            label: 'b',
            selectt: [{
                valuee: '123'
            }],
            root: 1,
            R: 1,
            RR: 0
        }, {
            label: 'c',
            selectt: [{
                valuee: '123'
            }],
            root: 1,
            R: 1,
            RR: 1
        }, {
            label: 'd',
            selectt: [{
                valuee: '123'
            }],
            root: 1,
            R: 1,
            RR: 2
        }],
        [{
            label: 'a',
            selectt: [{
                valuee: '123'
            }],
            root: 2,
            R: 0,
            RR: -1
        }, {
            label: 'b',
            selectt: [{
                valuee: '123'
            }],
            root: 2,
            R: 1,
            RR: 0
        }, {
            label: 'c',
            selectt: [{
                valuee: '123'
            }],
            root: 2,
            R: 1,
            RR: 1
        }, {
            label: 'd',
            selectt: [{
                valuee: '123'
            }],
            root: 2,
            R: 1,
            RR: 2
        }]
    ]

    root可以不用管, R = 0 属于一级节点 R > 0 且RR = -1 或0属于二级节点 R > 0 且RR > 0 属于三级节点
    我想用el的组件, 需要变换json的内容形式, 但每次到了三级节点就会出错
    前端刚接触不久, 我也只会用笨办法, 遍历 + 判断得到一级节点, 再再其中遍历 + 判断……
    避免贻笑大方, 代码我就不贴出来了, 这个问题困扰了我四天了, 尝试了五六次都不行,
    希望解决方法不要依靠label或者valuee的值
    诉求是上面的形式变成下边这样的:

```javascript
[{
        id: 1,
        label: 'a:123',
        children: [{
            id: 3,
            label: 'b123',
            children: [{
                id: 5,
                label: 'c123',
            }, {
                id: 6,
                label: 'd123',
            }]
        }]
    }, {
        id: 2,
        label: 'a:123',
        children: [{
            id: 4,
            label: 'b123',
            children: [{
                id: 7,
                label: 'c123',
            }, {
                id: 8,
                label: 'd123',
            }]
        }]
    }]

希望能给出可以使用的代码,如果应用时遇到问题,我会继续追问到可以正常使用为止。
我不会问该问题应用范围外的问题,请放心。

  • 写回答

4条回答 默认 最新

  • been_ss 2021-11-03 23:23
    关注

    哈喽,代码大概是这样,一次遍历存长度,为了设置id,二次遍历设置数据:有用请点采纳哦~

    
          const arr = [
            [
              {
                label: "a",
                selectt: [
                  {
                    valuee: "123",
                  },
                ],
                root: 1,
                R: 0,
                RR: -1,
              },
              {
                label: "b",
                selectt: [
                  {
                    valuee: "123",
                  },
                ],
                root: 1,
                R: 1,
                RR: 0,
              },
              {
                label: "c",
                selectt: [
                  {
                    valuee: "123",
                  },
                ],
                root: 1,
                R: 1,
                RR: 1,
              },
              {
                label: "d",
                selectt: [
                  {
                    valuee: "123",
                  },
                ],
                root: 1,
                R: 1,
                RR: 2,
              },
            ],
            [
              {
                label: "a",
                selectt: [
                  {
                    valuee: "123",
                  },
                ],
                root: 2,
                R: 0,
                RR: -1,
              },
              {
                label: "b",
                selectt: [
                  {
                    valuee: "123",
                  },
                ],
                root: 2,
                R: 1,
                RR: 0,
              },
              {
                label: "c",
                selectt: [
                  {
                    valuee: "123",
                  },
                ],
                root: 2,
                R: 1,
                RR: 1,
              },
              {
                label: "d",
                selectt: [
                  {
                    valuee: "123",
                  },
                ],
                root: 2,
                R: 1,
                RR: 2,
              },
            ],
          ];
          const res = []; // 结果
          const len = [0, 0]; // 存长度,第一个为二级长度,第二个为三级长度
          arr.forEach(out => {
            out.forEach(v => {
              if (v.R > 0) {
                v.RR <= 0?len[0]++:len[1]++;
              }
            });
          });
          const index = [0, 0];  // 存下标,第一个为二级下标,第二个为三级下标
          arr.forEach((out, i) => {
            res.push({
              id: i + 1,
              children: [],
            });
            out.forEach((v) => {
              const sel = v.selectt.map((v) => v.valuee).join(","); // valuee转字符串
              const label = `${v.label}:${sel}`; // 拼接label
              if (v.R == 0) {
                // 一级
                res[i].label = label;
              } else if (v.R > 0) {
                if (v.RR <= 0) {
                  // 二级
                  res[i].children.push({
                    id: arr.length + index[0] + 1,
                    label,
                    children: [],
                  });
                  index[0]++;
                } else {
                  // 三级
                  res[i].children[v.R - 1].children.push({
                    id: arr.length + len[0] + index[1] + 1,
                    label,
                    children: [],
                  });
                  index[1]++;
                }
              }
            });
          });
          console.log(res)
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(3条)

报告相同问题?

问题事件

  • 系统已结题 11月16日
  • 已采纳回答 11月8日
  • 创建了问题 11月3日

悬赏问题

  • ¥15 装 pytorch 的时候出了好多问题,遇到这种情况怎么处理?
  • ¥20 IOS游览器某宝手机网页版自动立即购买JavaScript脚本
  • ¥15 手机接入宽带网线,如何释放宽带全部速度
  • ¥30 关于#r语言#的问题:如何对R语言中mfgarch包中构建的garch-midas模型进行样本内长期波动率预测和样本外长期波动率预测
  • ¥15 ETLCloud 处理json多层级问题
  • ¥15 matlab中使用gurobi时报错
  • ¥15 这个主板怎么能扩出一两个sata口
  • ¥15 不是,这到底错哪儿了😭
  • ¥15 2020长安杯与连接网探
  • ¥15 关于#matlab#的问题:在模糊控制器中选出线路信息,在simulink中根据线路信息生成速度时间目标曲线(初速度为20m/s,15秒后减为0的速度时间图像)我想问线路信息是什么