js递归生成树形结构
先看结果
结果
[
{
"id": 1,
"title": "张三",
"parent_id": -1,
"childs": [
{
"id": 2,
"title": "张小二",
"parent_id": 1,
"childs": [
{
"id": 3,
"title": "张小三",
"parent_id": 2,
"childs": []
}
]
}
]
}
]
再看代码
方法
/**
* 生成tree
* @param parent_id 父id
*/
const initTree = (parent_id) => {
// jsonArray 变量数据
// 第一次以后:根据id去查询parent_id相同的(相同为子数据)
// 第一次:查找所有parent_id为-1的数据组成第一级
const child = jsonArray.filter(item => item.parent_id == parent_id)
// 第一次:循环parent_id为-1数组
return child.map(item => ({
...item,
// 当前存在id(id与parent_id应该是必须有的)调用initTree() 查找所有parent_id为本id的数据
// childs字段写入
childs: initTree(item.id)
}))
}
// 首先调用initTree方法查找所有parent_id为-1的(-1认为是第一级)
const tree = initTree(-1)
console.log(tree)
jsonArray 源数据
[
{
"id": 1, // id,与parent_id关联
"title": "张三",
"parent_id": -1,//父级id -1为第一级,与id做关联查询父子级关系
},
{
"id": 2,
"title": "张小二",
"parent_id": 1,
},
{
"id": 3,
"title": "张小三",
"parent_id": 2,
}
]