When a vue is redirected, the system determines whether the user is logged on.
Determine whether the user has logged on. If the user has not logged on, the login logon route is redirected. if the user has logged on, the login route is redirected normally.
1. First, a status is provided before and after user logon to identify whether the user is logged on (vuex is recommended );
Simply use vuex to show it. You won't be able to visit the official website on your own;
Import Vue from 'vue 'import Vuex from 'vuex' vue. use (Vuex); var state = {isLogin: 0, // initially give an isLogin = 0 indicating that the user has not logged on}; const mutations = {changeLogin (state, data) {state. isLogin = data ;}};
2. Change the logon status during user logon;
This. $ store. commit ('angelogin', '20140901') // change the logon status after logon. isLogin = 100;
Iii. Key Points;
Add a navigation hook to your route entry. For more information, see the code;
1. Set the route to be verified
{Path: '/admin', component: admin, meta: {auth: true} // you do not need to write the route that requires verification for the current route. Do not ask why, visit the official website by yourself}
Ii. Route jump and Verification
Router. beforeEach (to, from, next) => {if (. matched. some (m => m. meta. auth) {// verify the route if (store. state. isLogin = '000000') {// you have logged on to next () // you are redirected to the configured page.} else {// if you are not logged on, the logon page is displayed. query: {Rurl: to. fullPath} indicates passing the current route information to facilitate the jump back after logon; next ({path: '/login', query: {Rurl:. fullPath }}} else {next ()}})
The implementation of the above vue route jump function to determine whether a user is logged on is all the content shared by Alibaba Cloud. I hope to give you a reference and support for the customer's house.