buildTree
将扁平数组构建为树形结构
扁平数据
[
{
"id": 1,
"name": "根节点1",
"parentId": null
},
{
"id": 2,
"name": "子节点1-1",
"parentId": 1
},
{
"id": 3,
"name": "子节点1-2",
"parentId": 1
},
{
"id": 4,
"name": "孙节点1-1-1",
"parentId": 2
},
{
"id": 5,
"name": "根节点2",
"parentId": null
},
{
"id": 6,
"name": "子节点2-1",
"parentId": 5
}
]树形结构
[
{
"id": 1,
"name": "根节点1",
"parentId": null,
"children": [
{
"id": 2,
"name": "子节点1-1",
"parentId": 1,
"children": [
{
"id": 4,
"name": "孙节点1-1-1",
"parentId": 2,
"children": []
}
]
},
{
"id": 3,
"name": "子节点1-2",
"parentId": 1,
"children": []
}
]
},
{
"id": 5,
"name": "根节点2",
"parentId": null,
"children": [
{
"id": 6,
"name": "子节点2-1",
"parentId": 5,
"children": []
}
]
}
]函数签名
typescript
interface BuildTreeOptions {
idKey?: string
parentIdKey?: string
childrenKey?: string
rootParentId?: any
}
function buildTree<T>(items: T[], options?: BuildTreeOptions): T[]参数
| 参数名 | 类型 | 必填 | 说明 |
|---|---|---|---|
items | T[] | 是 | 扁平数组 |
options | BuildTreeOptions | 否 | 配置选项 |
返回值
| 类型 | 说明 |
|---|---|
T[] | 树形结构数组 |
工作原理
- 创建ID映射表
- 为每个节点添加空的children数组
- 遍历所有节点建立父子关系
- 根据parentId将节点挂载到父节点
- parentId为null的节点作为根节点
- 返回根节点数组