递归对树形结构数据处理 -- JS模糊查询
2019-08-09 本文已影响0人
侯工
下面是我们要处理的数据,简写:
let arr = [
{
title: '你好吗?',
children: [
{
title: '很好啊',
children: null
},
{
title: '是吗',
children: null
}
]
},
{
title: '卡卡卡',
children: [
{
title: '非常好芬',
children: null
}
]
},
{
title: '第三方的',
children: null
}
];
再搜索框输入 “好” 字时,希望树形结构中带有 “好” 字的项显示,即使父节点没有 “好” 字,但子节点含有,父节点仍要返回;代码实现如下:
const rebuildData=(value, arr) => {
let newarr = [];
arr.forEach(element => {
if (element.children && element.children.length) {
const ab = rebuildData(value,element.children);
const obj = {
...element,
children: ab
};
if (obj.title.indexOf(value) > -1 || (ab && ab.length))
newarr.push(obj);
}
} else {
if (element.title.indexOf(value) > -1) {
newarr.push(element);
}
}
});
return newarr;
};
console.log(rebuildData( '好', arr));
输出如下图: