Jump route Reference document: https://router.vuejs.org/zh/guide/advanced/navigation-guards.html
Creating permission.js in the / src permissions check
And the global introduction of main.js in:
import './permission'
/ * * * Permissions check: * Pre-hook function beforeEach (to, from, next) Vue Router in * Before routing jump, determination is made whether already logged in, then allow access to non-landed login page, otherwise back to the login page * * to: target route object about to enter the * from: routing object is about to leave the * next: is a method, you can specify the routing address, routing jump * / Import Router from './router' {from} getUserInfo Import '@ / API / Login' router.beforeEach ((to, from, Next) => { // 1. Get token const = localStorage.getItem token ( 'MSM-token' ) IF (! token) { // 1.1 If no response is received, access to non-login page, not to visit, go to the login page / the Login IF (to.path! = '/ the Login' ) { Next ({path: '/ Login' }) } the else { // request login page / Login Next ({}) } } the else { // 1.2 to acquired token, // 1.2.1 request routing / login, then go target route iF (to.path === '/ Login' ) { Next () } the else { // 1.2.2 non login page request routing, first check whether the user information in the local const userInfo = localStorage.getItem ( 'msm -user ' ) IF (the userInfo) { // local acquired, it directly to the target route Next () } the else { // If the user information is not available locally, it is to acquire user information token getUserInfo (token) .then (Response => { const RESP = response.data IF (resp.flag) { // If the acquired user information, the non-login page, or back to the login page // save to a local localStorage.setItem ( 'MSM-the user' , JSON.stringify (resp.data)) the Next () } the else { // did not get to the user information, log back next ({path: '/ login ' }) } }) } } } })