JavaScript转List为Tree

JavaScript

2022年03月10日 17:15:162287

直接上代码

function toTree(data) {
   const dataMap = {};
   data.forEach(item => {
      dataMap[item.id] = item;
   });
   const result = [];
   data.forEach(item => {
      let parent = dataMap[item.pid];
      parent?(parent.children || (parent.children = [])).push(item):result.push(item);
   });
   return result;
}

测试数据

[
   {id: 1, pid: 0, label: 'aaaaa'},
   {id: 2, pid: 1, label: 'bbbbb'},
   {id: 3, pid: 1, label: 'ccccc'},
   {id: 4, pid: 0, label: 'ddddd'},
   {id: 5, pid: 4, label: 'eeeee'},
   {id: 6, pid: 1, label: 'fffff'},
   {id: 7, pid: 0, label: 'ggggg'},
   {id: 8, pid: 6, label: 'hhhhh'}
]

输出结果

[{
      "id": 1,
      "pid": 0,
      "label": "aaaaa",
      "children": [{
         "id": 2,
         "pid": 1,
         "label": "bbbbb"
      }, {
         "id": 3,
         "pid": 1,
         "label": "ccccc"
      }, {
         "id": 6,
         "pid": 1,
         "label": "fffff",
         "children": [{
            "id": 8,
            "pid": 6,
            "label": "hhhhh"
         }]
      }]
   }, {
      "id": 4,
      "pid": 0,
      "label": "ddddd",
      "children": [{
         "id": 5,
         "pid": 4,
         "label": "eeeee"
      }]
   },
   {
      "id": 7,
      "pid": 0,
      "label": "ggggg"
   }
]

此方法主要使用到了JS对象引用类型,应该是你想要的吧~

赞 3
收藏
分享

本作品系 原创,作者:x先生

原文链接:https://shiniest.cn/blog/article/151

文本版权:文本版权归作者所有

转载需著名并注明出处(禁止商业使用)

评论和回复

0/500
    没有更多啦~
    怎么一条数据都没有呢?
简介
本文主要介绍一种将数据库查询出来的对象数组,转化为树形对象数组的方法。比如 菜单 。
目录
推荐阅读

D&D By x先生 With