js、vue根据父节点id生成树形结构

>>这里是参考链接

自己定义的假数据

 let data = [
{
employeeId: "",
ouName: "",
parentPosition: "",
positionCode: "",
preferredName: "",
},
]

为了更灵活一些规定对象字段key值

 let attributes = {
id: 'positionCode',
//这里是本节点id
parentId: 'parentPosition', //父节点id
name: 'preferredName', // 本节点名称
rootId: '1' // 根节点的id
};

然后执行下面方法

let treeData = this.toTreeData(data, attributes);

toTreeData (data, attributes) {
let resData = data;
let tree = [];
for (let i = 0; i < resData.length; i++) {
if (resData[i].parentPosition === attributes.rootId) {
// 注意这里的parentPosition 要和自己的父节点id字段一样
let obj = {
id: resData[i][attributes.id],
title: resData[i][attributes.name],
children: []
};
tree.push(obj);
resData.splice(i, 1);
i--;
}
}
run(tree);
function run(chiArr) {
if (resData.length !== 0) {
for (let i = 0; i < chiArr.length; i++) {
for (let j = 0; j < resData.length; j++) {
if (chiArr[i].id === resData[j][attributes.parentId]) {
let obj = {
id: resData[j][attributes.id],
title: resData[j][attributes.name],
children: []
};
chiArr[i].children.push(obj);
resData.splice(j, 1);
j--;
}
}
run(chiArr[i].children);
}
}
}
return tree;
},

最后

以上就是懦弱御姐为你收集整理的js、vue根据父节点id生成树形结构的全部内容，希望文章能够帮你解决js、vue根据父节点id生成树形结构所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。