扁平转树状案例1,动态字段名

60 阅读1分钟

废话不多说直接上代码

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Document</title>
</head>

<body>
  <script>
    // 原数据demo
    const sourceArr = [
      {
        alarmTime: '一号报警器',
        levelName: '五级泄露',
        type: 3,
        id: `111111111111111`
      },
      {
        alarmTime: '二号报警器',
        levelName: '四级泄露',
        type: 3,
        id: `22222222222222222`
      },
      {
        alarmTime: '二号报警器',
        levelName: '四级泄露',
        type: 3,
        id: `23232323232323232`
      },
      {
        alarmTime: '三号报警器',
        levelName: '一级泄露',
        type: 1,
        id: `44444444444444444444`
      },
      {
        alarmTime: '四号报警器',
        levelName: '二级泄露',
        type: 2,
        id: `3333333333333333333`
      }
    ]

    const temp = {}
    sourceArr.forEach(item => {
      if (!(item.type && item.levelName in temp)) {
        temp[item.levelName] = {
          levelName: item.levelName,
          type: item.type,
          children: []
        }
      }

      temp[item.levelName].children.push(item)
    })

    console.log(Object.values(temp).sort((a, b) => b.type - a.type))
  </script>
</body>

</html>

![{BI1QN28G1_9[Y`G5LG42A.png

代码图二

![G{K(F$[@]@@_DDVCRS5U.png