路由配置及动态路由—vue-router

import routeMap from './router/component.js';
const NotFound = () => import('./page/404.vue');
const formatRoutes = function (routes, routeData) {if (!routeData) {routeData = {name: 'home',path: '/home',// 组件匹配成功的话才可以访问具体的页面              component: routeMap['home'],children: [],};}routes.length && routes.forEach(route => {if (route.component) {route.component = routeMap[route.component];routeData.children.push({path: route.path,name: route.index,component: route.component,meta: {title: route.title,// if (route.children && route.children.length) {// formatRoutes(route.children, routeData);// }}})return routeData;};})let isFetchRemote = true;//使用钩子函数对路由进行权限跳转    router.beforeEach((to, from, next) => {const username = sessionStorage.getItem('username');if (!username && to.path !== '/login') {next({path: '/login'});} else if (isFetchRemote && to.path !== '/login') {ajaxPost('/resourceAPI/getMenuData').then(res => {if (res.status === 200 && res.data.errno === 0) {isFetchRemote = false;const menuData = res.data.result;localStorage.setItem('menudata', JSON.stringify(menuData));const routeData = formatRoutes(menuData);resourceApp.$router.addRoutes([routeData].concat([{name: '404',path: '/404',component: NotFound},{path: '*',redirect: '/404'}]));resourceApp.$router.push({path: to.path,query: to.query});} else {isFetchRemote = true;}next();}).catch(err => {console.log(err);});} else {next();}});
}
const resourceApp = new Vue({router,render: h => h(App)
}).$mount('#app')