前端框架 admin vue权限设置

核心代码：

const whistlist=["/login"]
router.beforeEach(async(to,from,next)=>{
    NProgress.start()
    const hastoken=getToken() //从cookie中获取token
    if(hastoken){  //如果有token
        if (to.path === '/login') {
            // if is logged in, redirect to the home page
            next({ path: '/' })
            NProgress.done()
           }else{
            if(store.getters.roles && store.getters.roles.length > 0){//如果权限roles不空
               next()
                }else{  //如果为空   我们去获取用户信息和身份                    
                     let roles_
                     await store.dispatch("get_userinfo").then((roles)=>{// 获取到当前用户的身份 
                        roles_=roles
                     })
                     // 然后拿着身份去筛选路由
                     let accessRoutes
                     await store.dispatch("generateRoutes",roles_).then((result)=>{
                          accessRoutes=result
                     })             
                     router.addRoutes(accessRoutes)
                    // router.options.routes.push(accessRoutes)
                     //next()                 
                    next({ ...to, replace: true })        
                }

            }
   
    }else{// 如果没有token
         
        if(whistlist.indexOf(to.path)!==(-1)){  //如果在白名单中 允许   
            next()  
        }else{
            next("/login")
            NProgress.done()
        }

    }
})

roles是储存用户身份的数组 表示你是管理员 还是超级管理员
generateRoutes是拿着身份去过滤异步的路由 然后返回结果 和原来的路由合并
generateRoutes的函数如下

   generateRoutes(context,roles_){
         let result
          return new Promise((resolve,reject)=>{
              if(roles_==="admin"){//如果是超级管理员 就获取所有的异步路由
                  result=syncrouter
          
              }else{

                result=filter_router(syncrouter,roles_)
              }
              context.commit("SET_ROUTE",result)
              resolve(result)
          })
     }

其中的filter_router是关键 是递归过滤路由 代码如下 syncrouter是我们定义好的异步路由

export function filter_router(syncrouter,roles_){
      let result=[] 
        syncrouter.forEach((value)=>{
        if(value.meta.roles.indexOf(roles_)!==(-1)){ // 如果包含权限
            if(value.children){
                value.children=filter_router(value.children,roles_)
            }
            result.push(value)
          }
       })
      return result
  }