前端实现树形表格搜索功能

// 搜索
const handleSearch = () => {
  if (form.category_name) {
    tableData = rebuildData(form.category_name, tableData)
  
  }
}
// 重点代码 根据name字段模糊匹配树状结构数据，最后将处理好的数据返回出来
const rebuildData = (value: any, arr: any) => {
  if (!arr) {
    return []
  }
  let newArr: any = []
  arr.forEach((element: any) => {
    console.log(element, 'element')
    // indexOf用来判读当前节点name字段是否包含所搜索的字符串value
    // 返回值：包含则返回索引值，反之返回-1
    if (element.category_name.indexOf(value) > -1) {
      const ab = rebuildData(value, element.children)
      const obj = {
        ...element,
        children: ab
      }
      newArr.push(obj)
    } else {
      // 判断当前节点知否有子节点，并且子节点中有数据，有数据继续递归查找
      if (element.children && element.children.length > 0) {
        const ab = rebuildData(value, element.children)
        const obj = {
          ...element,
          children: ab
        }
        if (ab && ab.length > 0) {
          newArr.push(obj)
        }
      }
    }
  })
  return newArr
}