Import route
import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
Dynamic route matching
The key to realizing dynamic routing configuration is routing nesting and router-view (rendering the matched routing components)
. Example:
export const constantRoutes = [
{
path: '/', //匹配第一层菜单
component: Layout,//本条路由映射的组件
redirect: '/dashboard',
children: [{ //匹配一级菜单下的二级菜单(匹配的结果会放入<router-view />中)
path: 'dashboard',
name: 'Dashboard',
component: () => import('@/views/dashboard/index'),//二级菜单映射的组件
meta: { title: 'Dashboard', icon: 'dashboard' }
}]
},
]
const createRouter = () => new Router({
// mode: 'history', // require service support
scrollBehavior: () => ({ y: 0 }),
routes: constantRoutes
})
const router = createRouter()
// Detail see: https://github.com/vuejs/vue-router/issues/1234#issuecomment-357941465
export function resetRouter() {
const newRouter = createRouter()
router.matcher = newRouter.matcher // reset router
}
//暴露路由
export default router