vue-element-admin中动态路由404页面的问题。

注意：需要在请求 路由接口之后，把跳转404的页面拼接到路由数组后

// router/index.js
export const constantRoutes = [
  {
    path: '/login',
    component: () => import('@/views/login/index'),
    hidden: true
  },

  {
    path: '/404',
    component: () => import('@/views/404'),
    hidden: true
  },
]

// 404 page must be placed at the end !!!
export const otherRoutes = [{ path: '*', redirect: '/404', hidden: true }]

vuex配置中

// store/modules/permission.js 
const mutations = {
  SET_ROUTES: (state, routes) => {
/*
routes -> 接口中返回的数据
state.addRoutes -> 动态路由 + 404页面
state.routes -> 静态路由 + 动态路由 + 404页面

*/
    state.addRoutes = routes.concat(otherRoutes)
    state.routes = constantRoutes.concat(routes).concat(otherRoutes)
  }
}

const actions = {
  generateRoutes({ commit }) {
    return new Promise(resolve => {
      request('/routers') -> (res){
          res.data.routers
      }
    })
  }
}

导航守卫中

if ('第一次访问ip时') {

  await store.dispatch('permission/generateRoutes')


}