vue+elementui搭建后台管理界面(6登录和菜单权限控制[二])

根据权限计算路由的代码

/**
 * 通过meta.role判断是否与当前用户权限匹配
 * @param roles
 * @param route
 */
function hasRoles (roles, route) {
  if (route.meta && route.meta.roles) {
    return roles.some(role => route.meta.roles.includes(role))
  } else {
    return false
  }
}

/**
 * 递归过滤异步路由表，返回符合用户角色权限的路由表
 * @param routes asyncRouterMap
 * @param roles
 */
function filterAsyncRouter(asyncRouterMap, roles) {
  const accessedRouters = asyncRouterMap.filter(route => {
    // 404
    if(route.path === '*'){
      return true
    }else if (hasRoles(roles, route)) {
      if (route.children && route.children.length) {
        route.children = filterAsyncRouter(route.children, roles)
      }
      return true
    }
    return false
  })
  return accessedRouters
}
GenerateRoutes ({ commit }, data) {
    return new Promise(resolve => {
    const { roles } = data
    let accessedRouters
    if (roles.includes('admin')) {
        accessedRouters = asyncRouterMap
    } else {
        accessedRouters = filterAsyncRouter(asyncRouterMap, roles)
    }
    commit('SET_ROUTERS', accessedRouters)
    resolve()
    })
},/**
 * 通过meta.role判断是否与当前用户权限匹配