vue刷新返回404

简单的网页模板vue-admin-template打算采用动态路由的方式实现不同用户显示不同界面，加完permission等文件后，初步能实现不同用户登录展示不同界面，但vue网页刷新时返回404界面，以为是动态路由加载的问题，打算参考【1】中方法去解决，这种方法我理解是在router.afterEach中保存当前路由信息，接着在下一次router.beforeEach中如果from.name === null，则表示网页在刷新，则加载路由数据，这种方法我遇到JSON.stringify 循环引用，路由数据传不过去，直接传对象又不知道传过去的数据怎么解析，JSON.parse解析不了，至今没解决，然后翻到参考【2】中方法，动态路由每次都重定向到404，给了我启发，删除404试试呢，我就又看了下我的router，删掉静态路由中的{ path: '*', redirect: '/404', hidden: true, roles:['admin','bbbb','cccc']}路由(注意不要删除成动态路由里面的了，也不要删了静态路由的另一个)，居然就解决了vue-admin-template刷新返回404的问题。无语

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 !!!
  { path: '*', redirect: '/404', hidden: true, roles:['admin','bbbb','cccc']}
]

export const asyncRoutes = [
  {
    path: '/applyfor_equipments',
    component: Layout,
    children: [{
      path: 'applyfor_equipments',
      name: 'applyfor_equipments1',
      component: () => import('@/views/applyfor_equipments/index'),
      meta: { title: '申请设备', icon: 'applyfor_equipments', roles: ['admin', 'bbbb', 'cccc'], redirect: '/applyfor_equipments/applyfor_equipments' },
    }],
  },

  { path: '*', redirect: '/404', hidden: true, meta: { icon: 'qita', roles:['admin'] }}
]

【1】https://blog.csdn.net/qq_33974231/article/details/104468740

【2】https://forum.vuejs.org/t/vue-router-3-0-1-router-addroutes/33181/19