js 在多级的树结构数据中,只获取两级的树结构数据,并且可拓展
时间: 2024-03-06 07:46:17 浏览: 84
多级树结构
5星 · 资源好评率100%
你可以使用递归函数来获取多级树结构中的两级数据,并且可以通过添加参数来实现可拓展性。以下是一个示例代码:
```javascript
// 树结构数据
const data = [
{
id: 1,
label: 'Level 1-1',
children: [
{
id: 2,
label: 'Level 2-1',
children: [
{
id: 3,
label: 'Level 3-1'
},
{
id: 4,
label: 'Level 3-2'
}
]
},
{
id: 5,
label: 'Level 2-2',
children: [
{
id: 6,
label: 'Level 3-3'
},
{
id: 7,
label: 'Level 3-4'
}
]
}
]
},
{
id: 8,
label: 'Level 1-2',
children: [
{
id: 9,
label: 'Level 2-3',
children: [
{
id: 10,
label: 'Level 3-5'
},
{
id: 11,
label: 'Level 3-6'
}
]
},
{
id: 12,
label: 'Level 2-4',
children: [
{
id: 13,
label: 'Level 3-7'
},
{
id: 14,
label: 'Level 3-8'
}
]
}
]
}
];
// 获取两级树结构数据的函数
function getTreeLevel(data, level1 = 1, level2 = 2) {
return data.map(item => {
const result = {
id: item.id,
label: item.label
};
if (item.children && item.children.length > 0 && level1 > 0) {
result.children = getTreeLevel(item.children, level1 - 1, level2 - 1);
}
return result;
});
}
// 获取两级树结构数据
const treeData = getTreeLevel(data);
console.log(treeData);
```
在上面的代码中,我们定义了一个 `getTreeLevel` 函数,该函数接收三个参数:树结构数据 `data`,以及两个可选的参数 `level1` 和 `level2`,用于指定要获取的树结构的层数。默认情况下,`level1` 和 `level2` 分别为 1 和 2,即获取树结构的第一层和第二层数据。
在函数内部,我们使用 `map` 方法遍历树结构数据,并创建一个新的对象 `result`,该对象包含 `id` 和 `label` 属性,分别对应原始数据中的 `id` 和 `label` 属性。如果当前节点有子节点并且 `level1` 大于 0,则递归调用 `getTreeLevel` 函数,将子节点作为新的树结构数据,并将 `level1` 和 `level2` 分别减 1,直到 `level1` 为 0 或当前节点没有子节点。
最后,我们将结果数组返回并输出到控制台。
阅读全文