最近在写layui的项目,关于一个树形结构的问题。
先贴数据结构
[
{
"id": 13,
"title": "经营范围一",
"parentId": null,
"children": [
{
"id": 16,
"title": "01",
"parentId": 13,
"children": [
{
"id": 592,
"title": "11",
"parentId": 16,
"children": []
}
]
},
{
"id": 598,
"title": "ddd",
"parentId": 13,
"children": []
}
]
},
{
"id": 15,
"title": "经营范围三",
"parentId": null,
"children": [
{
"id": 18,
"title": "03",
"parentId": 15,
"children": [
{
"id": 594,
"title": "33",
"parentId": 18,
"children": []
}
]
}
]
}
];
这里有两个需求,第一个是选中部分子节点后,需要拿到选中子节点的id,但是当选中一个子节点的时候,父节点也是默认选中的,所以就需要递归遍历到最底层children为空的同级id,这里比较简单,就是一个简单的递归遍历。
function dataforeach(data) {
data.map(ele => {
if (ele.children.length > 0) {
dataforeach(ele.children)
} else {
certificate_BusinessScopeList.push({
businessScopeId: ele.id
})
}
})
}
第二个需求是根据已经选中的子id,查找父级的id,本以为也是简单的递归遍历,但是没写出来。
let result = [];
let res1 = "";
function find (data, id) {
const flatList = flatArr(data);
getParent(flatList, id);
return res1;
}
// 扁平化数组
function flatArr (data) {
data.map(ele => {
result.push({
"id": ele.id,
"parentId": ele.parentId,
})
flatArr(ele.children);
})
return result;
}
// 递归查找最外层parentId
function getParent (data, id) {
for (let i = 0; i < data.length; i++) {
const e = data[i];
if (e.id === id) {
if (e.parentId === null) {
res1 = e.id;
// return e.id;
return res1;
// console.log('uuu', e.id);
} else {
getParent(data, e.parentId)
}
}
else {
continue;
}
}
// console.log(res1, ' console.log(res1);');
return res1;
}
// Label l = list.stream().filter( x -> Objects.equals(x.getLableId(), label.getParentId()) ).findFirst().get();
const arr = [
{
"id": 13,
"title": "经营范围一",
"parentId": null,
"children": [
{
"id": 16,
"title": "01",
"parentId": 13,
"children": [
{
"id": 592,
"title": "11",
"parentId": 16,
"children": []
}
]
},
{
"id": 598,
"title": "ddd",
"parentId": 13,
"children": []
}
]
},
{
"id": 15,
"title": "经营范围三",
"parentId": null,
"children": [
{
"id": 18,
"title": "03",
"parentId": 15,
"children": [
{
"id": 594,
"title": "33",
"parentId": 18,
"children": []
}
]
}
]
}
];
console.log(find(arr, 15));
这样就可以拿到子id所在最外层的父元素的id。