let jsonData= [
{ id:1, parentId:0, name:"一級菜單A" },
{ id:2, parentId:0, name:"一級菜單B"},
{ id:3, parentId:0, name:"一級菜單C"},
{ id:4, parentId:1, name:"二級菜單A-A"},
{ id:5, parentId:1, name:"二級菜單A-B"},
{ id:6, parentId:2, name:"二級菜單B-A"},
{ id:7, parentId:4, name:"三級菜單A-A-A"},
{ id:8, parentId:7, name:"四級菜單A-A-A-A"},
{ id:9, parentId:8, name:"五級菜單A-A-A-A-A"},
];
將上述扁平化數據轉化成樹形結構
function formatTree(obj){
let copyedObj = JSON.parse(JSON.stringify(obj)) //深拷貝源數據
return copyedObj.filter(parent=>{
let findChildren = copyedObj.filter(child=>{
return parent.id === child.parentId
})
findChildren.length>0 ? parent.children = findChildren : parent.children = []
return parent.parentId == 0 //返回頂層,依據實際情況判斷這里的返回值
})
}
}
console.log(JSON.stringify(formatTree(jsonData),null,3))
[
{
"id": 1,
"parentId": 0,
"name": "一級菜單A",
"children": [{
"id": 4,
"parentId": 1,
"name": "二級菜單A-A",
"children": [{
"id": 7,
"parentId": 4,
"name": "三級菜單A-A-A",
"children": [{
"id": 8,
"parentId": 7,
"name": "四級菜單A-A-A-A",
"children": [{
"id": 9,
"parentId": 8,
"name": "五級菜單A-A-A-A-A",
"children": []
}]
}]
}]
},
{
"id": 5,
"parentId": 1,
"name": "二級菜單A-B",
"children": []
}]
},
{
"id": 2,
"parentId": 0,
"name": "一級菜單B",
"children": [{
"id": 6,
"parentId": 2,
"name": "二級菜單B-A",
"children": []
}]
},
{
"id": 3,
"parentId": 0,
"name": "一級菜單C",
"children": []
}
]