When using Ant Design Vue Pro, the original login is the account of the ordinary user, and then log out and switch to the admin account, it is found that the left menu is still the original menu of the ordinary user, which needs to be refreshed to display normally.
The idea of the first modification is to refresh the page after the successful login, but the flash is not good for the user experience, so the method of resetting the route can be adopted at this time.
In the router/index. In js
const createRouter = () => new Router({ mode: 'hash', routes: Consistent TrouterMap}) const Router = CreateRouter () // Exports a method to reset the route, Export function resetRoute () {const neWrOuter = createrOuter () router.matcher = neWrOuter. export default router
Store /modules/user.js where you log out
Import {resetRoute} from '@/router' // Logout ({commit, state }) { return new Promise((resolve) => { logout(state.token).then(() => { resolve() }).catch(() => { resolve() }).finally(() => {// ResetRoute () commit('SET_TOKEN', ') commit('SET_ROLES', 'SET_ROLES'). []) storage.remove(ACCESS_TOKEN) Cookies.remove(ACCESS_TOKEN, { path: '/', domain: process.env.VUE_APP_DOMAIN }) }) }) }
Then switch between different users left menu no problem!