AntDesignProVue 保留登录页面获取token,取消动态路由

  1. 修改 src/router/index.js
import Vue from 'vue'
import Router from 'vue-router'
import { constantRouterMap, asyncRouterMap } from '@/config/router.config'

Vue.use(Router)

export default new Router({
  mode: 'history',
  // routes: constantRouterMap
  routes: constantRouterMap.concat(asyncRouterMap)
})

2.src/layouts/BasicLayout.vue

  1. 新增import
import { asyncRouterMap } from '@/config/router.config.js'

2)同时修改created

created () {
    // const routes = this.mainMenu.find(item => item.path === '/')
    // this.menus = (routes && routes.children) || []
    
    this.menus = asyncRouterMap.find((item) => item.path === '/').children
    // this.menus = this.mainMenu.find((item) => item.path === '/').children

    // 处理侧栏收起状态
    this.$watch('collapsed', () => {
      this.$store.commit(SIDEBAR_TYPE, this.collapsed)
    })
    this.$watch('isMobile', () => {
      this.$store.commit(TOGGLE_MOBILE_TYPE, this.isMobile)
    })
},

3.修改src/Permission.js(从判断是否存在token开始替换,修改完成保留token,取消动态路由)

/* has token */
// if (storage.get(ACCESS_TOKEN)) {
//   if (to.path === loginRoutePath) {
//     ...
//   }
// } else {
//   if (allowList.includes(to.name)) {
//     // 在免登录名单,直接进入
//     next()
//   } else {
//     next({ path: loginRoutePath, query: { redirect: to.fullPath } })
//     NProgress.done() // if current page is login will not trigger afterEach hook, so manually handle it
//   }
// }

替换成

if (storage.get(ACCESS_TOKEN)) {  //是否存在token
  next()
} else {
  if (to.path === '/user/login') { // 如果是登录页面路径,就直接next()
    next()
  } else { // 不然就跳转到登录;
    next('/user/login')
  }
}
原文地址:https://www.cnblogs.com/AdolphWilliam/p/15562351.html