js树形结构递归

js树形结构递归

1、过滤数据

// 菜单列表
const menuList = [{
    
    
    name: '系统管理',
    code: 'system_manage',
    children: [{
    
    
        name: '字典管理',
        code: 'code_manage',
        children: [{
    
    
            name: '添加字典',
            code: 'add_code'
        }, {
    
    
            name: '编辑字典',
            code: 'edit_code'
        }, {
    
    
            name: '删除字典',
            code: 'del_code',
            children: [{
    
    
               name: '添加字典3级菜单',
               code: 'add_code_3'
        }]
        }]
    }, {
    
    
        name: '角色管理',
        code: 'role_manage',
        children: [{
    
    
            name: '添加角色',
            code: 'add_role'
        }]
    }]
}, {
    
    
    name: 'cms管理',
    code: 'cms_manage',
    children: [{
    
    
        name: '文章管理',
        code: 'word_manage'
    }]
}, {
    
    
    name: '评论管理',
    code: 'comment_manage'
}]

// 权限列表
const myMenuCode = ['system_manage', 'code_manage', 'add_code','del_code', 'add_code_3','comment_manage']

const filterMenuList = (menuList, menuCode) => {
    
    
    return menuList.filter(item => {
    
    
        return menuCode.indexOf(item.code) > -1
    }).map(item => {
    
    
        item = Object.assign({
    
    }, item)
        if (item.children) {
    
    
            item.children = filterMenuList(item.children, menuCode)
        }
        return item
    })
}

// 过滤后的菜单
const menuData= filterMenuList (menuList, myMenuCode)

console.log(menuData)

2、复制到F12 console 里面使用看看吧

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/qq_39367226/article/details/109772531