扁平的数据转树状数据

扁平的数据转树状数据

let subData = [
{name: "1", id: "1"},
{name: "1-1", id: "1-1"},
{name: "1-1-1", id: "1-1-1"},
{name: "1-2", id: "1-2"},
{name: "1-2-1", id: "1-2-1"},
{name: "1-2-2", id: "1-2-2"},
{name: "2", id: "2"},
{name: "2-1", id: "2-1"},
{name: "2-2", id: "2-2"},
{name: "3", id: "3"},
{name: "3-1", id: "3-1"},
{name: "3-2", id: "3-2"},
{name: "3-1-1", id: "3-1-1"},
{name: "4", id: "4"},
{name: "10", id: "10"},
{name: "10-1", id: "10-1"},
{name: "10-1-10", id: "10-1-10"}
]

给定一个扁平的数据转成树状数据，以id区分层级

function getData(arr) {
// 顶层数据
let parentData = arr.filter(item => {
return !item.id.includes("-");
})
// 所有子数据
let childrenData = arr.filter(item => {
let atr = item.id.includes("-")
if (atr) {
let atr2 = item.id.split("-");
atr2.pop();
let atr3 = atr2.join("-");
// 所有的子数据添加parentID字段，等于父级的id
item.parentID = atr3；
}
return atr;
})
let translator = (parentData, childrenData ) => {
parentData.forEach((parent) => {
childrenData.forEach((current, index) => {
if (current.parentID === parent.id) {
let temp = JSON.parse(JSON.stringify(children))
temp.splice(index, 1)
translator([current], temp);
typeof parent.children !== 'undefined' ? parent.children.push(current) : parent.children = [current]
}
}
)
}
)
}
translator(parentData, childrenData)
return parents
}
// 调用方法
getData(subData)

最后输出结果：

[
{
"name": "1",
"id": "1",
"children": [
{
"name": "1-1",
"id": "1-1",
"parentID": "1",
"children": [
{
"name": "1-1-1",
"id": "1-1-1",
"parentID": "1-1"
}
]
},
{
"name": "1-2",
"id": "1-2",
"parentID": "1",
"children": [
{
"name": "1-2-1",
"id": "1-2-1",
"parentID": "1-2"
},
{
"name": "1-2-2",
"id": "1-2-2",
"parentID": "1-2"
}
]
}
]
},
{
"name": "2",
"id": "2",
"children": [{
"name": "2-1",
"id": "2-1",
"parentID": "2"
},
{
"name": "2-2",
"id": "2-2",
"parentID": "2"
}
]
},
{
"name": "3",
"id": "3",
"children": [
{
"name": "3-1",
"id": "3-1",
"parentID": "3",
"children": [
{
"name": "3-1-1",
"id": "3-1-1",
"parentID": "3-1"
}
]
},
{
"name": "3-2",
"id": "3-2",
"parentID": "3"
}
]
},
{
"name": "4",
"id": "4"
},
{
"name": "10",
"id": "10",
"children": [
{
"name": "10-1",
"id": "10-1",
"parentID": "10",
"children": [
{
"name": "10-1-10",
"id": "10-1 -10",
"parentID": "10-1"
}
]
}
]
}
]

最后

以上就是害羞大白最近收集整理的关于扁平的数据转树状数据的全部内容，更多相关扁平内容请搜索靠谱客的其他文章。