业务场景
在vue中我们经常需要对不同角色实现不同的路由权限
如管理员可以看见所有路由页面,普通员工只能看到部分和自己业务相关的路由
这个时候我们需要对不同角色分配不同的路由权限
实现步骤
router.js中按变量分配不同路由
代码语言:javascript复制// 公共路由
export const constantRoutes = []
// sidebarRoutes管理员路由
export const sidebarRoutes_admin = []
// sidebarRoutes代理路由
export const sidebarRoutes_agent = []
生成路由方法
代码语言:javascript复制actions: {
// 生成路由
GenerateRoutes({
commit
}) {
return new Promise(resolve => {
getLevelId().then(res => {
setLevel(res.data.level_id)
if (getLevel() == 1 || getLevel() == 2) {
const rewriteRoutes = sidebarRoutes_admin
rewriteRoutes.push({
path: '*',
redirect: '/404',
hidden: true
})
commit('SET_ROUTES', rewriteRoutes)
commit('SET_SIDEBAR_ROUTERS', constantRoutes.concat(sidebarRoutes_admin))
commit('SET_DEFAULT_ROUTES', sidebarRoutes_admin)
commit('SET_TOPBAR_ROUTES', sidebarRoutes_admin)
resolve(rewriteRoutes)
}
if(getLevel() == 3){
const rewriteRoutes = sidebarRoutes_agent
rewriteRoutes.push({
path: '*',
redirect: '/404',
hidden: true
})
commit('SET_ROUTES', rewriteRoutes)
commit('SET_SIDEBAR_ROUTERS', constantRoutes.concat(sidebarRoutes_agent))
commit('SET_DEFAULT_ROUTES', sidebarRoutes_agent)
commit('SET_TOPBAR_ROUTES', sidebarRoutes_agent)
resolve(rewriteRoutes)
}
if(getLevel() == 4){
const rewriteRoutes = [];
rewriteRoutes.push({
path: '*',
redirect: '/404',
hidden: true
})
commit('SET_ROUTES', rewriteRoutes)
commit('SET_SIDEBAR_ROUTERS', constantRoutes)
// commit('SET_DEFAULT_ROUTES', sidebarRoutes_agent)
// commit('SET_TOPBAR_ROUTES', sidebarRoutes_agent)
resolve(rewriteRoutes)
}
resolve()
});
})
}