How does Vue set the default route dynamically?

1. The requirements are as follows:
there are two logins (merchant login page, user login page):
-1-first login merchant
-2-login user
-3-after the merchant logs in for the first time, there is no need to log in again, jump directly to the user page user login

2. I currently solve this problem:
the default route is set to the merchant login page, and the merchant id returned after a successful login is stored in the localStorage. In the merchant page created, get the value in localStorage to see if there is any. If so, skip to the user page

3. Existing problems:
when there is a value in localStorage, the merchant page does not automatically jump to the user page; sometimes it is possible; when I manually enter the merchant url, manually entering the merchant url, will not automatically jump to the user login page; directly refresh and automatically jump to the user login page

4. Ask what the question is, or is there a more general way (o " "o) asking

Vue-router vue.js
Mar.10,2021

the created () is not triggered when you enter url manually?
are you using the same component for both logins?
, that is to say, the file in which you write the created code is common to two login pages

.

try listening for changes in routes 

  watch: {
    '$route.name': function(val) {
      console.log(1, val)
    }
  }

this requirement can be solved with router.beforeEach ((to, from, next) .
token is equivalent to the login status of a merchant stored by you. I hope it will help you

. 
router.beforeEach((to, from, next){
    if (getToken()) { // 
        if (to.path === '/') {
          next({ path: '/' }) // token  
        }else{
            // 
            //  next()
        }
     } else {
        next({path:'/'})
     }
}

Previous: How to display the alert of Vue.js

Next: Android groupware, resources can not be read normally?

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu