Umgang mit der Version „router.push“ von vue-router3.0, die nicht in der Lage ist, die Seite zu aktualisieren

Dieses Mal werde ich Ihnen vorstellen, wie Sie damit umgehen können, dass die Seite nicht aktualisiert werden kann. Was sind die Vorsichtsmaßnahmen , um mit dem Router der vue-router3.0-Version umzugehen? .push konnte die Seite nicht aktualisieren. Dies ist ein praktischer Fall, schauen wir uns das an.

Gestern habe ich festgestellt, dass einige Routen nicht normal springen konnten. Nach der Suche stellte ich fest, dass es sich dabei um alle Orte handelte, an denen router.push nach der Instanziierung anstelle von this.$router verwendet wurde. direkt drücken.
Nach router.push ändert sich die URL, aber die Seite wird nicht aktualisiert. Sie müssen sie manuell aktualisieren, bevor der richtige Bildschirm angezeigt wird.

Ich habe einen Blick auf package.json geworfen, aber mein vue-router hat die Versionsnummern eindeutig nicht geschrieben.

Dann habe ich mit npm view vue-router überprüft und festgestellt, dass die von mir verwendete Version nicht mehr die Version in package.json war, also kam ich zu dem Schluss, dass es vielleicht mein npm-Aktualisierungsdatumvor ein paar Tagen! (Aktualisieren Sie in Zukunft nicht einfach so!)

Ich weiß nicht genau, warum die neue Version nicht funktioniert.

Die einfachste Lösung besteht natürlich darin, router.push direkt in this.$router.push zu ändern.

Aber wenn dies möglich ist, warum sollte ich dann in der ersten Komponente eine andere instanziieren? Ort? Was ist mit dem Router?

Natürlich ist es in Ordnung, ein Vue zu instanziieren und dann vue.$router zu verwenden, da dies an manchen Stellen kein Vue ist.

Die Antwort ist natürlich nein, denn dieser Vue und der Vue an

anderen

Orten sollten nicht dasselbe Objekt sein. Dann ist die ultimative Lösung:

Fügen Sie den Router im globalen Vue zum Fenster hinzu und verwenden Sie ihn in main.js:

window.router=router

Und dann den Rest Sie kann problemlos router.push und andere Router-Methoden überall verwenden.

Analysegrund:

Der Router nach der Instanz kann die Seite nicht aktualisieren, wahrscheinlich weil er nicht mit diesem identisch ist.$router im globalen Vue, aber davor Diese Version kann direkt verwendet werden, sie sollte einen Singleton verwenden.

Woher weiß ich das, warum Sie keine Singletons mehr verwenden?

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Detaillierte Erläuterung der Kontrollschritte zur Anmeldeüberprüfung für React from React-Router Route

JS zur Implementierung eine einfache detaillierte Erklärung der Rechnerschritte

Das obige ist der detaillierte Inhalt vonUmgang mit der Version „router.push“ von vue-router3.0, die nicht in der Lage ist, die Seite zu aktualisieren. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!