console 命令行工具 X clear

console

let nodeList = [
    { id: '1-1', children: [{ id: '1-2-1' }, { id: '1-2-2' }] },
    { id: '2-1' },
    { id: '3-1', children: [{ id: '3-2-1', children: [{ id: '3-3-1' }] }] }
]

/**********************方式一************************************* */
function filterTree(tree = [], validate = () => { }, param = [], arr = []) {

    if (!tree.length) return []
    for (let item of tree) {
        if (!validate.apply(null, [item, param])) continue
        let node = { ...item, children: [] }
        arr.push(node)
        if (item.children && item.children.length) filterTree(item.children, validate, param, node.children)
    }
    return arr
}
function validate(node, map) {
    console.log("过滤数据2:", node, map)
    return map.includes(node.id)
}
let rs = [];
filterTree(nodeList, validate, new Array('1-2-1', '3-1'), rs)
console.log(rs)

/**********************方式二************************************* */
function filter2(nodes, predicate) {
    // 如果已经没有节点了，结束递归
    if (!(nodes && nodes.length)) {
        return [];
    }
    const newChildren = [];
    for (const node of nodes) {
        if (predicate(node)) {
            // 如果节点符合条件，直接加入新的节点集
            newChildren.push(node);
            node.children = filter2(node.children, predicate);
        } else {
            // 如果当前节点不符合条件，递归过滤子节点，
            // 把符合条件的子节点提升上来，并入新节点集
            newChildren.push(...filter2(node.children, predicate));
        }
    }
    return newChildren;
}
const tree = filter2(nodeList, (node) => new Array('1-2-1', '3-1').includes(node.id));
console.log(tree)


/**********************方式三************************************* */
// 根据传入的值进行数据匹配, 并返回匹配结果
function filterMethod(val, data, filterType) {
    return val.includes(data[filterType])
}
/*
*	对表格数据进行处理
*	data 为树形数据数组
*	filter 为过滤参数即用户输入的值
*	filterType 为用户通过什么字段与filter 匹配
*/
function tableFilter(data, filter, filterType) {
    const traverse = (data) => {
        data.forEach(child => {
            console.log("dddddd:",child)
            child.visible = this.filterMethod(filter, child, filterType)
            if (child.children) traverse(child.children)
            if (!child.visible && child.children && child.children.length) {
                let visible = !child.children.some(child => child.visible);
                child.visible = visible === false;
            }
        })
    }
    traverse(data)
    return this.filterDataByVisible(data)
}
// 递归过滤符合条件的数据
function filterDataByVisible(data) {
    return data.filter(item => {
        if (item.children) {
            item.children = this.filterDataByVisible(item.children)
        }
        if (item.visible) {
            return true
        }
    })
}
console.log(tableFilter(nodeList,['1-2-1', '3-1'],"id"))

/**************************************************************** */
//JS树结构操作:查找、遍历、筛选、树结构和列表结构相互转换
//https://blog.csdn.net/OUalen/article/details/131438154

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      const a = [
        {
          id: 1,
          children: {
            id: 2,
          },
        },
        {
          id: 3,
          children: {
            id: 4,
            children: {
              id: 5,
              children: {
                id: 6,
              },
            },
          },
        },
      ];

      function deal(nodes, predicate) {
        // 如果已经没有节点了，结束递归
        if (!(nodes && nodes.length)) {
          return [];
        }

        const newChildren = [];
        for (const node of nodes) {
          if (predicate(node)) {
            // 如果节点符合条件，直接加入新的节点集
            newChildren.push(node);
            node.children = deal(node.children, predicate);
          } else {
            // 如果当前节点不符合条件，递归过滤子节点，
            // 把符合条件的子节点提升上来，并入新节点集
            newChildren.push(...deal(node.children, predicate));
          }
        }
        return newChildren;
      }
      console.log("a", JSON.stringify(a));

      const result = deal(a, (node) => node.id == 1||node.id == 4);

      // console.log(JSON.stringify(result, null, 4));
      console.log("result", result);
    </script>
  </body>
</html>