Heim > Web-Frontend > js-Tutorial > Vue erkennt, dass die Seite nach der Anmeldung zur vorherigen Seite springt

Vue erkennt, dass die Seite nach der Anmeldung zur vorherigen Seite springt

小云云
Freigeben: 2018-01-09 09:49:13
Original
3959 Leute haben es durchsucht

In der Entwicklung stoßen wir häufig auf eine solche Anforderung. Der Benutzer muss direkt auf einen Link klicken, um eine Seite aufzurufen. Nachdem er sich angemeldet hat, wird ein 401-Abfang ausgelöst. Es wird zur verlinkten Seite statt zur Startseite gesprungen. Wie kann ein solches Problem gelöst werden? Dieser Artikel teilt Ihnen hauptsächlich eine Funktion von Vue mit, um nach der Anmeldung einen Seitensprung zur vorherigen Seite zu implementieren. Freunde, die diesen Komfort benötigen, können davon lernen. Ich hoffe, es hilft allen.

Lassen Sie uns zunächst über einige APIs sprechen, die wir verwenden müssen:

1.router.currentRoute: Das aktuelle Routing-Informationsobjekt. Wir können die analysierte URL über router.currentRoute.fullPath abrufen. Enthält den vollständigen Pfad der Abfrageparameter und des Hashs. Wenn die Route der Seite, auf die zugegriffen werden soll, einen Namen hat, können Sie den Namen der aktuellen Route über router.currentRoute.name abrufen.

2.router.replace: Die Funktion ist dieselbe wie router.push, fügt jedoch keine neuen Datensätze zum Verlauf hinzu, sondern ersetzt den aktuellen Verlaufseintrag.

Da jeder Code anders geschrieben ist, werde ich meinen spezifischen Implementierungscode nicht angeben, sondern die Idee kurz vorstellen:

1 Nachdem der Benutzer auf den Link geklickt hat, wird das Ziel zum Weiterleiten angezeigt Seite, lösen Sie dann den 401-Interceptor aus und kehren Sie zur Anmeldeseite zurück:


//401拦截
if(status == "401"){
  router.push("/login")   
}
Nach dem Login kopieren

2. Wir können den Ziellink während der 401-Interception in der URL speichern:


if (status == 401) {
   //判断当前的路由是否是目标路由
   if(router.currentRoute.name == "target"){
    //跳转回login路由,并把目标路由的url路径保存在login的query中
    router.replace({
     name:"login",
     query: {redirect: router.currentRoute.fullPath}
    })
   }else{
    /* 普通401拦截直接返回到登录页面 */
    router.push('/login');
   }
  }
Nach dem Login kopieren

3. Nachdem Sie auf „Anmelden“ geklickt haben, verwenden Sie die in der URL gespeicherte Abfrage, um direkt zur Zielseite zurückzukehren


router.push({path:decodeURIComponent(url)});
Nach dem Login kopieren

Verwandte Empfehlungen:

So klicken Sie auf Text in WeChat Xiaocheng, um die Seitensprungfunktion zu realisieren

Antworten auf Fragen zu HTML Seitensprung-Übergabeparameter

HTML-Seitensprung- und Parameterübergabeprobleme

Das obige ist der detaillierte Inhalt vonVue erkennt, dass die Seite nach der Anmeldung zur vorherigen Seite springt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage