js递归过滤树的常用方法(根据条件去掉树的某些节点)

1,549 阅读1分钟

1.改变键值对

filterTree(treeArr) {
      function eachItem(arr) {
        let res = arr.filter(item => {
          if (item.children && item.children.length > 0) {
            item.children = eachItem(item.children)
          }
          item.key = item.id
          return item
        })
        return res
      }
      return eachItem(treeArr)
    },
    //[
    //     {
    //         key: 6,
    //         path: "/modal",
    //         name: "弹窗",
    //         component: "modal/index",
    //         title: "弹窗", icon: "home", children: []
    //       }
    //]
    
    //[
    //     {
    //         id: 6,
    //         path: "/modal",
    //         name: "弹窗",
    //         component: "modal/index",
    //         title: "弹窗", icon: "home", children: []
    //       }
    //]
    

2.根据条件保留某些节点

从树tree中过滤掉,树的key不在bList数组中的节点

        filterTreeArray(tree, bList) {
            return tree.filter(item => {
                return bList.indexOf(item.key) > -1
            }).map(item => {
                item = Object.assign({}, item)
                if (item.children) {
                    item.children = this.filterTreeArray(item.children, bList)
                }
                return item
            })
        }
      // let menuData = this.filterTreeArray(this.treeData, menuCheckedKyes)   
/*
this.treeData=[
    {
        key: 2,
        name: "构建类管理",
    },
    {
        name: "三级菜单",
        key: 3,
        children: [
            {
                key: 34,
                name: "routeview",
                children: [
                    {
                        key: 35,
                        name: "菜单管理",
                        children: []
                    }
                ]
            },
             {
                key: 36,
                name: "组织管理",
                children: []
            },
        ]
    },
]
menuCheckedKyes=[2,3 , 34]  只要key是2、3、34的
过滤后
this.treeData=[
    {
        key: 2,
        name: "构建类管理",
    },
    {
        name: "三级菜单",
        key: 3,
        children: [
            {
                key: 34,
                name: "routeview",
                children: []
            },
        ]
    },
]

*/