使用childid从对象数组创建嵌套对象数组
问题我有一个平面的对象数组,我需要一个(深度)嵌套的对象数组。
我的平面数组(ID 在现实中是随机的,但为了清楚起见在此处进行了更改,嵌套可能非常深):
const tags = [
{
id: 'tag1',
title: 'Tag 1',
childIds: ['tag11', 'tag12'],
root: true
},
{
id: 'tag11',
title: 'Tag 11',
childIds: ['tag111', 'tag112'],
},
{
id: 'tag12',
title: 'Tag 12',
childIds: ['tag121']
},
{
id: 'tag111',
title: 'Tag 111',
childIds: []
},
{
id: 'tag112',
title: 'Tag 112',
childIds: []
},
{
id: 'tag121',
title: 'Tag 121',
childIds: []
}
]
我想要的输出:
tagsNested = [
{
id: 'tag1',
title: 'Tag 1',
tags: [
{
id: 'tag11',
title: 'tag 11',
tags: [
{
id: 'tag111',
title: 'Tag 111',
tags: []
},
{
id: 'tag112',
title: 'Tag 112',
tags: []
}
]
},
{
id: 'tag12',
title: 'tag 12',
tags: [
{
id: 'tag121',
title: 'Tag 121',
tags: []
}
]
}
]
}
]
到目前为止,我最大的努力就是将所有标签嵌套在任何标签下。
一、 我得到了一个嵌套数组,但是每个标记数组包含所有标记。
function unflatten(tag, nestedTags) {
if (tag.childIds) {
tag.childIds.forEach((childId) => {
var childTag = tags.find((t) => t.id === childId)
childTag.tags = unflatten(childTag, nestedTags)
nestedTags.push(childTag)
})
}
return nestedTags
}
const rootTag = tags.find((tag) => tag.root)
console.log(unflatten(rootTag, []))
我真的在为这些递归函数苦苦挣扎,并弄清楚如何让 return 语句提供正确的数据。
回答
这是一种递归方法。它是这样工作的:
根
标签数组
根
您可以尝试以下代码片段:
const tags = [
{
id: 'tag1',
title: 'Tag 1',
childIds: ['tag11', 'tag12'],
root: true
},
{
id: 'tag11',
title: 'Tag 11',
childIds: ['tag111', 'tag112'],
},
{
id: 'tag12',
title: 'Tag 12',
childIds: ['tag121']
},
{
id: 'tag111',
title: 'Tag 111',
childIds: []
},
{
id: 'tag112',
title: 'Tag 112',
childIds: []
},
{
id: 'tag121',
title: 'Tag 121',
childIds: []
}
]
function buildTag({id, title, childIds}, tagsArray) {
const tags = tagsArray
.filter(tag => childIds.includes(tag.id))
.map(tag => buildTag(tag, tagsArray))
return {
id,
title,
tags,
}
}
const rootTag = tags.find((tag) => tag.root)
console.log()
/*
tagsNested = [
{
id: 'tag1',
title: 'Tag 1',
tags: [
{
id: 'tag11',
title: 'tag 11',
tags: [
{
id: 'tag111',
title: 'Tag 111',
tags: []
},
{
id: 'tag112',
title: 'Tag 112',
tags: []
}
]
},
{
id: 'tag12',
title: 'tag 12',
tags: [
{
id: 'tag121',
title: 'Tag 121',
tags: []
}
]
}
]
}
]
*/
页:
[1]