vue路由动态重定向首页

问题:

路由权限生成后,每个用户角色的权限都不同,

怎么保证在通过路由守卫后进入(path: ‘/’ )正确跳到该用户拥有权限的首页面呢?

第一种解决方案:由后端来返回路由

以下为前端自行解决方案:

 // 根据roles权限生成可访问的路由表
          store.dispatch('GenerateRoutes', { res }).then(() => {
            // 动态添加可访问路由表
            // router.addRoutes(store.getters.addRouters)
            // hack方法 确保addRoutes已完成
            // next({ ...to, replace: true })

            // 动态路由重定向 start
            router.addRoutes(store.getters.addRouters)
            let str = ''
            function filterAsyncRouter (asyncRouterMap) {
              str += asyncRouterMap[0].path
              if (
                asyncRouterMap[0].children &&
                asyncRouterMap[0].children.length &&
                asyncRouterMap[0].children[0].meta.type !== 1
              ) {
                str += '/'
                filterAsyncRouter(asyncRouterMap[0].children)
              } else {
                return str
              }
            }
            if (from.path === '/login') {
              filterAsyncRouter(store.getters.addRouters, str)
              next({
                path: str,
                replace: true
              })
            } else {
              next({ ...to, replace: true })
            }
            // 动态路由重定向 end
          })

 

posted @ 2020-11-11 15:28  鹿lu  阅读(3553)  评论(0编辑  收藏  举报