vue-admin动态路由的实现

前言：项目开发中菜单栏往往是后端基于角色控制的，所以菜单栏通过后端返回，然后在进行渲染，vue-admin这个管理系统模板用的人贼多，以此为例。

一、首先打开router/index.js文件吗，把constantRoutes写的静态路由全删了，只留下公共的界面，比如login、404之类的。其他路由后面通过接口获取。

二、在store/modules/permission.js进行修改，如果没有文件就创建，该文件使用vuex的状态管理，把菜单信息存储起来，最后把菜单渲染出去

// router/index.js下面定义写死的那个公共界面，用于拼接后端返回的菜单
import { constantRoutes } from '@/router'
// api接口
import { getRouter } from '@/api/user'
const state = {
  routes: [], //最后拼接完成的路由,需要暴露出去
  addRoutes: [] //后端返回的路由
}
const mutations = {
  SET_ROUTES: (state, routes) => {
    state.addRoutes = routes
    state.routes = constantRoutes.concat(routes)
  }
}
cons