vue-admin-template 动态路由的实现（方式一

{

path: ‘accesssettings’,

component: () => import(‘@/views/officialaccounts/accesssettings/index’),

meta: { title: ‘接入设置’, icon: ‘’ }

},

{

path: ‘menu’,

component: () => import(‘@/views/officialaccounts/menu/index’),

meta: { title: ‘菜单设置’, icon: ‘’ }

},

{

path: ‘attentionreply’,

component: () => import(‘@/views/officialaccounts/attentionreply/index’),

meta: { title: ‘关注回复’, icon: ‘’ }

},

{

path: ‘keywordreply’,

component: () => import(‘@/views/officialaccounts/keywordreply/index’),

meta: { title: ‘关键字回复’, icon: ‘’ }

},

{

path: ‘material’,

component: () => import(‘@/views/officialaccounts/material/index’),

meta: { title: ‘素材管理’, icon: ‘’ }

}

]

},

]

const createRouter = () => new Router({

// mode: ‘history’, // require service support

scrollBehavior: () => ({ y: 0 }),

routes: constantRoutes.concat(asyncRoutes).concat(errorRoutes)

})

export 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

• 获取动态路由数据api/user.js

import request from ‘@/utils/request’

import qs from ‘qs’

/**

*动态路由

*/

export function getAuthMenu() {

return request({

url: ‘/Admin/Index’,

method: ‘get’

})

}

• 修改权限规则（store/module/permission.js）

vue-admin-template模板本身是没有做权限的，自己创建一个即可，规则自己设定，admin中使用的roles配置的，我这里是自动生成的，本质还是生成新的路由list（只是包含新的路由）

注意：store/module/permission.js和项目根目录下的permission别搞混了

import { asyncRoutes, constantRoutes, errorRoutes } fr