数组对象 的name的值进行筛选 返回包含关键字的数据？

Question

 const data = [
        {
            name: '小强',
            children: [
                { name: '小红'},
                {
                    name: '红',
                    children: [
                        {name: '老明'},
                        {name: '小红2'}
                    ]
                },
                {
                    name: '大',
                    children: [
                        { name: '老明' },
                        { name: '小红2'}
                    ]
                },
                { name: '小'}
            ]
        }
    ]

Answer 1

const filterArr = (arr, name) => {
    arr = JSON.parse(JSON.stringify(arr)) // 防止arr被修改
    return arr.filter((item) => {
        if (item.children?.length) {
            item.children = filterArr(item.children, name)
        }
        return item.name.includes(name) || !!item.children?.length
    })
}
filterArr(data, '明')
filterArr(data, '红')

Answer 2

递归一下咯。每次用 includes 去判断一下 name 是否包含目标文本，如果有则返回对象，如果没有则返回空，然后判断一下返回值就行。

Answer 3

function findData (data, keyword) {
  if (!data || !data.length) return data
  
  const nodes = []
  data.forEach(node => {
    const newCh = findData(node.children, keyword)
    if (node.name.includes(keyword) || newCh) {
      const newNodes = { ...node }
      newCh ? (newNodes.children = newCh) : (delete newNodes.children)
      nodes.push(newNodes)
    }
  })
  return nodes
}
console.log(findData(data, '明'))

Answer 4

function filterBy(name, list) {
   return list.reduce((res, v) => {
     const children = v.children && filterBy(name, v.children)
     // 有子集或者name包含则push，push时默认保留了children字段【可能为undefined】
     // 如果不想保留该字段可以在push里在做一次判断`children ? {...v,children} : v`
     if(v.name.includes(name) || children) res.push({...v, children});
     return res;
   }, [])
}