javaScript 递归生成树形(tree)结构
原始数据const temp = [{'id': 1,'name': '1级1','parentId': 0},{'id': 2,'name': '2级1','parentId': 0},{'id': 4,'name': '1级1-1',.
·
- 原始数据
const temp = [
{
'id': 1,
'name': '1级1',
'parentId': 0
},
{
'id': 2,
'name': '2级1',
'parentId': 0
},
{
'id': 4,
'name': '1级1-1',
'parentId': 1
},
{
'id': 6,
'name': '1级1-1-1',
'parentId': 4
},
{
'id': 12,
'name': '2级1-1',
'parentId': 2
},
{
'id': 13,
'name': '3级1',
'parentId': 0
},
{
'id': 14,
'name': '3级1-1',
'parentId': 13
},
{
'id': 15,
'name': '1级1-1-1-1',
'parentId': 6
}
]
- 递归生成后的树形结构数据
[{
"id": 1,
"label": "1级1",
"children": [{
"id": 4,
"label": "1级1-1",
"children": [{
"id": 6,
"label": "1级1-1-1",
"children": [{
"id": 15,
"label": "1级1-1-1-1"
}]
}]
}]
},
{
"id": 2,
"label": "2级1",
"children": [{
"id": 12,
"label": "2级1-1"
}]
},
{
"id": 13,
"label": "3级1",
"children": [{
"id": 14,
"label": "3级1-1"
}]
}
]
- 递归方法
// 调用方法, temp为原始数据, result为树形结构数据
var result = generateOptions(temp)
// 开始递归方法
generateOptions(params) {
var result = []
for (const param of params) {
if (param.parentId === 0) { // 判断是否为顶层节点
var parent = {
'id': param.id,
'label': param.name
}
parent.children = this.getchilds(param.id, params) // 获取子节点
result.push(parent)
}
}
return result
},
getchilds(id, array) {
const childs = []
for (const arr of array) { // 循环获取子节点
if (arr.parentId === id) {
childs.push({
'id': arr.id,
'label': arr.name
})
}
}
for (const child of childs) { // 获取子节点的子节点
const childscopy = this.getchilds(child.id, array)// 递归获取子节点
if (childscopy.length > 0) {
child.children = childscopy
}
}
return childs
}
更多推荐
已为社区贡献4条内容
所有评论(0)