最简便的list数据转树形结构方法（递归详细）

后台返回数据是一行一行的，但是前端展示要树形结构数据，所以需要我们自己处理函数了，小编在此献丑了，小写一个简便函数供大家参考，希望反馈一下。

返回数据格式 :

var list = [

{ name: '根目录1' , id: 1, parentId: 0 }, 

{ name: '根目录2' , id: 2, parentId: 0 }, 

{ name: '目录1-1' , id: 3, parentId: 1 },

{name: '目录1-2' , id: 4, parentId: 1 },

{name: '目录2-1' , id: 5, parentId: 2 },

{name: '目录1-2-1' , id: 6, parentId: 4 }

];

看到数据格式，大家很明白，name用来显示的，id是唯一值，parentId是父目录的id，而且第一级的父id为0；所以根据这个我们就可以组装了，函数如下

 

function arrayToTree(arr, parentId) {

     //  arr 是返回的数据  parendId 父id

    let temp = [];

    let treeArr = arr;

    treeArr.forEach((item, index) => {

        if (item.parentId == parentId) {

            if (arrayToTree(treeArr, treeArr[index].id).length > 0) {

                 // 递归调用此函数

              treeArr[index].children = arrayToTree(treeArr, treeArr[index].id);

            }

            temp.push(treeArr[index]);

        }

   });

   return temp;

}

console.log(arrayToTree(list , 0));   // 第一级的父目录id是0；写死调用

// [{ name: ‘根目录1’ , id: 1: parentId: 0 , children:[{ name: ‘目录1-1’ , id: 3: parentId: 1 },{ name: ‘目录1-2’ , id: 4: parentId: 1              , children:[{name: ‘目录1-2-1’ , id: 6, parentId: 4 }]}]}, 

    { name: ‘根目录2’ , id: 2: parentId: 0 , children:[{ name: ‘目录2-1’ , id: 5: parentId: 2 } ]}

]