js使用filter递归过滤树形结构(tree)数组中不为null的数据

最新推荐文章于 2024-03-02 16:14:23 发布

朽木自雕(coder)

最新推荐文章于 2024-03-02 16:14:23 发布

阅读量2.6k

点赞数 1

文章标签： html 前端

本文链接：https://blog.csdn.net/qq_45404003/article/details/121921254

版权

js使用filter递归过滤树形结构(tree)数组中不为null的数据

最近在做项目是遇到了一个问题，就是在使用tree树形结构显示数据时，由于后端返回的tree数据中有null值，不能把null值渲染到页面上去，就对数据进行了过滤处理，具体代码如下：

     let myList = [
           {
                name: '系统管理',
                code: 'system_manage',
                children: [
                    {
                        name: '用户管理',
                        code: 'user_manage',
                        children: [
                            {
                                name: '添加用户',
                                code: 'add_user'
                            },
                            {
                                name: '商品管理',
                                code: null //goods_manage
                            },
                            {
                                name: '编辑用户',
                                code: null //edit_user
                            }, 
                            {
                                name: '删除用户',
                                code: 'del_user'
                            },
                            {
                                name:'修改密码',
                                code: null
                            }
                        ]
                    }, 
                    {
                        name: '角色管理',
                        code: 'role_manage',
                        children: [
                            {
                                name: '添加角色',
                                code: 'add_role'
                            },
                            {
                                name: '分类管理',
                                code: null//classify_manage
                            }
                        ]
                    }
                ]
            }, 
            {
                name: '业务管理',
                code: 'bus_manage',
                children: [
                    {
                        name: '流程管理',
                        code: 'process_manage'
                    }
                ]
            }, 
            {
                name: '订单管理',
                code: 'order_manage'
            },
            {
                name: '会员管理',
                code: null
            }
        ]
   
  let filterList = (myList, Code) => {
         return myList.filter(item => {
                return item.code != Code //过滤条件
         }).map(item => {
                item = Object.assign({}, item)
                if (item.children) {
                    item.children = filterList(item.children, Code)
                }
                return item
            })
        }
        
        // 过滤后的数据
        let myArr = filterList(myList, null)
        console.log(myArr)