我在使用 vuejs 的项目上遇到问题。
我有一个这样的嵌套对象数组:
数据
data: [
{
"id":1,
"parent_id":null,
"title":"First folder",
"children":[
{
"id":3,
"parent_id":1,
"title":"First folder in parents",
"children":[]
},
{
"id":4,
"parent_id":1,
"title":"Second folder in parents",
"children":[
{
"id":5,
"parent_id":4,
"title":"test",
"children":[]
}
],
}
]
},
{
"id":2,
"parent_id":null,
"title":"Second folder",
"children":[],
}
]
我想在计算属性中获取特定 id 的所有 parent 的数组 computed: {
parents() {
this.getAllParents(data, currentId);
},
},
我的功能 getParents(array, id, parentsId) {
for (let i = 0; i < array.length; i++) {
const child = array[i];
if (child.id === id && ((child.children.length > 0 && child.children.some((el) => el.id === parentsId)) || !parentsId)) {
return [child];
} if (child.children.length > 0) {
const x = this.getParents(child.children, child.id, id);
if (x) return Array.isArray(x) ? [child, ...x] : [child, x];
}
}
return [];
},
例如,如果我的 currentId 是 3,我希望在我的计算中这样:[
{"id": 1, "parent_id": null....},
{"id": 3, "parent_id": 1....}
]
如果我的 currentId 是 1,我想要这个:[
{"id": 1, "parent_id": null....},
]
如果我的 currentId 是 5,我想要这个:[
{"id": 1, "parent_id": null....},
{"id": 4, "parent_id": 1....},
{"id": 5, "parent_id": 4....},
]
现在,我的功能return [
{"id": 1, "parent_id": null....},
{"id": 4, "parent_id": 1....}
]
如果我当前的 id 是 3,而不是 id:3,我不明白为什么请问这个怎么做?
谢谢
最佳答案
您可以递归循环子数组并继续收集 parent 。
请引用以下解决方案:
const data = [
{
id: 1,
parent_id: null,
title: "First folder",
children: [
{ id: 3, parent_id: 1, title: "First folder in parents", children: [] },
{
id: 4,
parent_id: 1,
title: "Second folder in parents",
children: [{ id: 5, parent_id: 4, title: "test", children: [] }],
},
],
},
{ id: 2, parent_id: null, title: "Second folder", children: [] },
];
const getAncestors = (target, children, ancestors = []) => {
for (let node of children) {
if (node.id === target) {
return ancestors.concat(node.id);
}
const found = getAncestors(target, node.children, ancestors.concat(node.id));
if (found) {
return found;
}
}
return undefined;
};
console.log(getAncestors(5, data));
注:我刚推了
id
s 为简洁起见,您可以更新解决方案以推送整个节点。
关于javascript - 获取嵌套数组JS中对象的所有父项,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/72401950/