js用遞歸的方式過濾數(shù)組

最近遇到一個問題，先貼代碼

[
    { path: 'levelone', name: '第一級', iconClass:'fa-navicon', isRoot: true, subMenus:[
        { path: 'leveltwo', name: '第二級', iconClass:'fa-navicon',subMenus:[
            { path: 'levelthree', name: '第三級', roles:['admin'], iconClass:'fa-navicon' }
        ]},
        { path: 'leveltwo_R', name: '第二級_R', iconClass:'fa-navicon' }
    ]},
    { path: 'user', name: '用戶管理', roles:['admin'], iconClass:'fa-language', isRoot: true },
    { path: 'dictionary', name: '字典管理', roles:['admin'], iconClass:'fa-language', isRoot: true },
    { path: 'role', name: '角色管理', roles:['admin'], iconClass:'fa-vcard', isRoot: true },
    { path: 'outline', name: '違規(guī)管理', roles:['admin'], iconClass:'fa-exclamation-triangle', isRoot: true }
]

我有這樣的一個數(shù)組，且數(shù)組層級未知，其葉子節(jié)點上都roles屬性,如果沒有或不包含admin，則需要篩選掉。請問怎么解決?這里肯定是需要用遞歸來實現(xiàn)的，我用了filter，但是在有subMenus的節(jié)點上，我用的是some來過濾

filterRoutes(route,role) {
  if(route.subMenus && route.subMenus.length){
    return route.subMenus.some((item) => {
      return this.filterRoutes(item,role);
    });
  }else{
    return route.roles && -1 < route.roles.indexOf(role);
  }
}

導(dǎo)致leveltwo_R這個節(jié)點沒有被遍歷，就是這里沒有想明白，求指點

回答

編輯回答

忘了我

some是有一個返回true就停止執(zhí)行了，所以第二個沒有去檢測

var arr = [
        { path: 'levelone', name: '第一級', iconClass:'fa-navicon', isRoot: true, subMenus:[
            { path: 'leveltwo', name: '第二級', iconClass:'fa-navicon',subMenus:[
                { path: 'levelthree', name: '第三級', roles:['admin'], iconClass:'fa-navicon' }
            ]},
            { path: 'leveltwo_R', name: '第二級_R', iconClass:'fa-navicon' }
        ]},
        { path: 'user', name: '用戶管理', roles:['admin'], iconClass:'fa-language', isRoot: true },
        { path: 'dictionary', name: '字典管理', roles:['admin'], iconClass:'fa-language', isRoot: true },
        { path: 'role', name: '角色管理', iconClass:'fa-vcard', isRoot: true , subMenus:[
            { path: 'leveltwo_R', name: '第二級_R', iconClass:'fa-navicon' },
            { path: 'leveltwo_R', name: '第二級_R', iconClass:'fa-navicon' },
            { path: 'leveltwo_R', name: '第二級_R', iconClass:'fa-navicon' }
        ]},
        { path: 'outline', name: '違規(guī)管理', roles:['admin'], iconClass:'fa-exclamation-triangle', isRoot: true }
    ]

function filterRoutes(route,role) {
    var bool;
    for(var i=route.length-1;i>=0;i--){
        bool = !(route[i].roles && route[i].roles.indexOf(role)>-1);
        if(route[i].subMenus && route[i].subMenus.length){
            filterRoutes(route[i].subMenus,role)
            bool && route[i].subMenus.length == 0 && route.splice(i,1)
        }else{
            bool && route.splice(i,1)
        }
    }
}
filterRoutes(arr,'admin')
console.log(arr)

2018年9月20日 07:40

編輯回答

耍太極


var f = item => {
    if (item['subMenus']) {
        item['subMenus'] = item['subMenus'].filter(f);
        return true;
    } else if (item['roles']) {
        return item['roles'].indexOf('admin') !== -1;
    } else {
        return false;
    }
}

var result = data.filter(f);

2018年6月30日 10:19

編輯回答

咕嚕嚕

var data = [
        {
            path: 'levelone', name: '第一級', iconClass: 'fa-navicon', isRoot: true, subMenus: [
                {
                    path: 'leveltwo', name: '第二級', iconClass: 'fa-navicon', subMenus: [
                        { path: 'levelthree', name: '第三級', roles: ['admin'], iconClass: 'fa-navicon' }
                    ]
                },
                { path: 'leveltwo_R', name: '第二級_R', iconClass: 'fa-navicon' }
            ]
        },
        { path: 'user', name: '用戶管理', roles: ['admin'], iconClass: 'fa-language', isRoot: true },
        { path: 'dictionary', name: '字典管理', roles: ['admin'], iconClass: 'fa-language', isRoot: true },
        { path: 'role', name: '角色管理', roles: ['admin'], iconClass: 'fa-vcard', isRoot: true },
        { path: 'outline', name: '違規(guī)管理', roles: ['admin'], iconClass: 'fa-exclamation-triangle', isRoot: true }
    ]
    var dataArr = [];
    function filter(arr) {
        for (let i = 0; i < arr.length; i++) {
            if(arr[i].subMenus && arr[i].subMenus.length){
                filter(arr[i].subMenus);
            }else{
                if(!(arr[i].roles && arr[i].roles.includes('admin'))){
                    dataArr.push(arr[i]);
                    arr.splice(i, 1)
                }
            }
        }
    }
    filter(data);
    console.log(data)
    console.log(dataArr)

在data里剔除了不符合條件的數(shù)據(jù)放到dataArr里面，不知道是不是你想要的結(jié)果

2018年8月30日 17:33