【权限管理】 ----动态路由刷新页面`404`问题解决

权限管理 ----动态路由刷新页面404问题解决

原因：刷新后路由规则重新走,路由规则中静态路由是固定有的,动态路由是在走路由守卫时添加进去的,而走静态路由时会先匹配通配符* 直接走404页面
解决:所以我们把404页面push到动态路由后

 if (store.state.user.token) {
    
    
    if (to.path === '/login') {
    
    
      next('/')
      NProgress.done()
    } else {
    
    
      // 在有token后获取用户信息,获取userId后就不再发送请求
      if (!store.state.user.userInfo.userId) {
    
    
        const {
    
     menus } = await store.dispatch('user/getInfo')

        const newArr = asyncRoutes.filter(route => {
    
    
          return menus.includes(route.children[0].name)
        })
        //将通配符路径推到动态路由后
        newArr.push({
    
     path: '*', redirect: '/404', hidden: true })
        router.addRoutes(newArr)
        store.commit('menu/getMenuList', newArr)
          next({
    
     path: to.path, replace: true }) 
      } else {
    
    
        next()
      }
    }
  } else {
    
    
    if (whiteList.includes(to.path)) {
    
    
      next()
    } else {
    
    
      next('/login')
      NProgress.done()
    }
  }```