一、扁平数组转树形
1 var data=[
2 {pid:0,id:'a',value:'陕西'},
3 {pid:'a',id:01,value:'西安'},
4 {pid:01,id:301,value:'雁塔区'},
5 {pid:01,id:302,value:'高新区'},
6 {pid:'a',id:02,value:'渭南'},
7 {pid:'a',id:03,value:'咸阳'},
8 {pid:0,id:'b',value:'广东'},
9 {pid:'b',id:11,value:'广州'},
10 {pid:'b',id:12,value:'深圳'},
11 {pid:'b',id:13,value:'潮汕'},
12 {pid:0,id:'c',value:'湖南'},
13 {pid:'c',id:21,value:'长沙'},
14 {pid:'c',id:22,value:'常德'},
15 {pid:'c',id:23,value:'岳阳'},
16 ];
17 function toTree(data){
18 let cloneData = JSON.parse(JSON.stringify(data)) // 对源数据深度克隆
19 let tree = cloneData.filter((father)=>{ //循环所有项
20 let branchArr = cloneData.filter((child)=>{
21 return father.id == child.pid;//返回每一项的子级数组
22 });
23 if(branchArr.length>0){
24 father.children = branchArr; //如果存在子级,则给父级添加一个children属性,并赋值
25 }
26 return father.pid==0;//返回第一层
27 });
28 return tree; //返回树形数据
29 }
30 var tree=toTree(data);
31 console.log(tree);
//下面是递归实现的方法:
1 function toTree(data) {
2 // 删除 所有 children,以防止多次调用
3 data.forEach(function (item) {
4 delete item.children;
5 });
6 // 将数据存储为 以 id 为 KEY 的 map 索引数据列
7 var map = {};
8 data.forEach(function (item) {
9 map[item.id] = item;
10 });
11 var val = [];
12 data.forEach(function (item) {
13 // 以当前遍历项,的pid,去map对象中找到索引的id
14 var parent = map[item.pid];
15 // 好绕啊,如果找到索引,那么说明此项不在顶级当中,那么需要把此项添加到,他对应的父级中
16 if (parent) {
17 (parent.children || ( parent.children = [] )).push(item);
18 } else {
19 //如果没有在map中找到对应的索引ID,那么直接把 当前的item添加到 val结果集中,作为顶级
20 val.push(item);
21 }
22 });
23 return val;
24 }
25 console.log(toTree(data))
二、树形数组转扁平
1 var data=[
2 {id: "a",pid: 0,value: "陕西",children:[
3 {id: 01,pid: "a",value: "西安"},
4 {id: 02,pid: "a",value: "渭南"},
5 {id: 03,pid: "a",value: "咸阳"},
6 ]},
7 {id: "b",pid: 0,value: "广东",children:[
8 {id: 11,pid: "b",value: "广州"},
9 {id: 12,pid: "b",value: "深圳"},
10 {id: 13,pid: "b",value: "潮汕"},
11 ]},
12 {id: "c",pid: 0,value: "湖南",children:[
13 {id: 21,pid: "c",value: "长沙"},
14 {id: 22,pid: "c",value: "常德"},
15 {id: 23,pid: "c",value: "岳阳"},
16 ]},
17 ];
18 function toLine(data){
19 return data.reduce((arr, {id, value, pid, children = []}) =>
20 arr.concat([{id, value, pid}], toLine(children)), [])
21 return result;
22 }
23 var listarr=toLine(data);
24 console.log(listarr);