javascript - 如何过滤嵌套树对象而不丢失javascript中的结构?
问题描述
为了在 React 中正确显示树视图,我需要过滤一个嵌套的树对象。
我发现这篇文章: 过滤嵌套树对象而不丢失结构
但实际上我想做完全相反的事情。例如,如果在我的 filterData 函数中name === "a3
“我想保留对象name === "a3"
const result = filterData(items, "a3")
const items = [
{
name: "a1",
id: 1,
children: [
{
name: "a2",
id: 2,
children: [
{
name: "a3",
id: 3
},
{
name: "a5",
id: 4
}
]
}
]
},
{
name: "b2",
id: 2,
children: [
{
name: "a2",
id: 2,
children: [
{
name: "a3",
id: 3
}
]
},
{
name: "a4",
id: 8
}
]
}
];
const result = [
{
name: "a1",
id: 1,
children: [
{
name: "a2",
id: 2,
children: [
{
name: "a3",
id: 3
}
]
}
]
},
{
name: "b2",
id: 2,
children: [
{
name: "a2",
id: 2,
children: [
{
name: "a3",
id: 3
}
]
}
]
}
];
解决方案
您可以在不改变给定数据的情况下创建新对象并减少数组。
function filter(array, name) {
return array.reduce((r, { children = [], ...o }) => {
if (o.name === name) {
r.push(o);
return r;
}
children = filter(children, name);
if (children.length) {
r.push(Object.assign(o, { children }));
}
return r;
}, []);
}
var items = [{ name: "a1", id: 1, children: [{ name: "a2", id: 2, children: [{ name: "a3", id: 3 }, { name: "a5", id: 4 }] }] }, { name: "b2", id: 2, children: [{ name: "a2", id: 2, children: [{ name: "a3", id: 3 }] }, { name: "a4", id: 8 }] }];
console.log(filter(items, "a2"));
console.log(filter(items, "a3"));
.as-console-wrapper { max-height: 100% !important; top: 0; }
推荐阅读
- python - 生成随机值 X
- python - 检查特定用户 ID 是否在语音通道中?
- go - 如何在用 Go 编写的 Hyperledger Fabric 链码中使用 UUID(作为字节数组)?
- c# - 调试“ResultView”显示“枚举没有结果”?
- postgresql - 添加 pgaudit Azure postgresql 是否是一种 Microsoft Azure 错误?
- amazon-web-services - 如何将 AWS 资源转换为 cloudformation 堆栈或模板?
- android - 可以从片段访问活动的属性和功能吗?
- soap - 使用 SoapClient 发送空字符串
- javascript - 如何在没有 jQuery 的情况下进行某些滚动后使 div 跟随?
- debugging - Eclipse CDT:附加到本地应用程序丢失