# 路由表
提示
- 路由表应该和菜单表分开
- 路由表只能嵌套两级方便做组件缓存(组件名要唯一)
- 菜单后台生成 减少更前端耦合
# 不授权模块
import Vue from 'vue'
import Router from 'vue-router'
import Layout from '@/layout'
Vue.use(Router)
/* Router Modules */
import menuRouter from './modules/menu'
/**
* 所有角色都可以访问
*/
export const constantRoutes = [
{
path: '/login',
component: () => import('@/views/login/index')
},
{
path: '/chat-client/feedback',
name: '投诉建议',
component: () => import('@/views/feedback')
},
{
path: '/chat-client/note',
name: '留言咨询',
component: () => import('@/views/note')
},
{
path: '/net-error',
name: '请求超时',
component: () => import('@/views/error/net-error')
},
{
path: '/404',
component: () => import('@/views/error/todo')
},
{
path: '/',
component: Layout,
redirect: '/home',
name: '主页',
children: [
{
path: 'home',
name: '首页',
component: () => import('@/views/home')
}
]
}
]
/**
* 根据用户需要动态加载路由
*/
export const asyncRoutes = []
asyncRoutes.push(...menuRouter.menuRouter)
// 添加路由子模块
// constantRoutes.push(...menuRouter.menuRouter)
const createRouter = () =>
new Router({
// mode: 'history', // require service support
scrollBehavior: () => ({ y: 0 }),
routes: constantRoutes
})
const router = createRouter()
export function resetRouter() {
const newRouter = createRouter()
router.matcher = newRouter.matcher // reset index
}
export default router
# 按权限动态渲染模块
import Layout from '@/layout'
const menuRouter = [
{
path: '/system-manager',
component: Layout,
redirect: '',
name: '系统管理',
children: [
{
path: 'user',
name: '用户管理',
component: () => import('@/views/system-manager/user')
},
{
path: 'user/add',
name: '新增用户',
component: () => import('@/views/system-manager/user/add-page'),
meta: { isTab: false, keepAlive: false }
},
{
path: 'roles',
name: '角色管理',
component: () => import('@/views/system-manager/roles')
},
{
path: 'roles/add',
name: '新增角色',
component: () => import('@/views/system-manager/roles/add-page'),
meta: { isTab: false, keepAlive: false }
}
]
}
]
export default {
menuRouter
}
# 过滤好后
- 路径配备不到时 重定向到 404
// 404 page must be placed at the end !!!
routerTree.push({ path: '*', redirect: '/404' })
router.addRoutes(routerTree)