Was nützt vue.router?

vue.router ist das offizielle Routing-Plugin, das die Erstellung von Single-Page-Anwendungen zum Kinderspiel macht. Die Single-Page-Anwendung von Vue basiert auf Routing und Komponenten. Routing wird zum Festlegen von Zugriffspfaden und zum Zuordnen von Pfaden und Komponenten verwendet. Das Umschalten zwischen Pfaden kann zum Erreichen von Seitenwechseln und -sprüngen verwendet werden.

【Empfehlung für einen verwandten Artikel: vue.js】 Die Funktion von

vue.router ist:

vue-router ist das offizielle Routing-Plug-In von Vue.js und tief integriert vue.js, geeignet zum Erstellen von Single-Page-Anwendungen. Die Single-Page-Anwendung von Vue basiert auf Routing und Komponenten. Routing wird zum Festlegen von Zugriffspfaden und zum Zuordnen von Pfaden und Komponenten verwendet. Herkömmliche Seitenanwendungen verwenden einige Hyperlinks, um Seitenwechsel und -sprünge zu erreichen. In der Vue-Router-Single-Page-Anwendung wird zwischen Pfaden gewechselt, dh zwischen Komponenten.

Vue-Router-Implementierungsprinzip

SPA (Einzelseitenanwendung): Eine Einzelseitenanwendung hat nur eine vollständige Seite; beim Laden der Seite wird nicht die gesamte Seite geladen, sondern nur ein bestimmter Containerinhalt aktualisiert. Einer der Kerne einer Single-Page-Anwendung (SPA) ist: Aktualisieren der Ansicht, ohne die Seite erneut anzufordern; vue-router bietet zwei Methoden bei der Implementierung des Single-Page-Front-End-Routings: Hash-Modus und Verlaufsmodus

1. Hash-Modus:

vue-router Standard-Hash-Modus – Verwenden Sie URL-Hash, um eine vollständige URL zu simulieren, sodass die Seite nicht neu geladen wird, wenn sich die URL ändert. Hash (#) ist der Ankerpunkt der URL, der eine Position auf der Webseite darstellt. Wenn Sie nur den Teil nach # ändern, scrollt der Browser nur zur entsprechenden Position und lädt die Webseite nicht neu , # wird zur Steuerung des Surfens verwendet. Es ist für die Serverseite völlig nutzlos und die HTTP-Anfrage enthält nicht gleichzeitig #. Jedes Mal, wenn der Teil nach # geändert wird, wird ein Datensatz zum Zugriffsverlauf des Browsers hinzugefügt . Verwenden Sie die Schaltfläche „Zurück“, um zur vorherigen Position zurückzukehren. Der Hash-Modus rendert also unterschiedliche Daten an der angegebenen DOM-Position entsprechend unterschiedlichen Werten durch die Änderung des Ankerpunktwerts:

Da der Hash-Modus ein eigenes # in der URL hat, können wir den Routing-Verlaufsmodus verwenden, wenn wir keinen hässlichen Hash wünschen. Bei der Konfiguration der Routing-Regeln müssen wir nur „Modus: ‚Verlauf‘“ hinzufügen . Dieser Modus nutzt die API „history.pushState“ vollständig aus, um den URL-Sprung abzuschließen, ohne die Seite erneut laden zu müssen.

ist das offizielle Routing-Plug-in von Vue.js. Es ist tief in vue.js integriert und eignet sich zum Erstellen von Einzelseitenanwendungen, wodurch die Erstellung von Einzelseitenanwendungen vereinfacht wird. Enthaltene Funktionen sind:

vue-router

Verschachtelte Routing-/Ansichtstabellen

• Modulare, komponentenbasierte Routing-Konfiguration

• Routenparameter, Abfragen, Platzhalter

• Basierend auf dem Vue.js-Übergangssystem Übergangseffekte anzeigen

• Fine-Körnern-Navigationskontrolle

• Links mit automatisch aktivierten CSS-Klassen

• HTML5-Verlaufsmodus oder Hash-Modus, die automatisch in IE9

• -addomisierten Scroll-Balken verhaltens basierend auf Routing und Komponenten Routing wird verwendet, um Zugriffspfade festzulegen und Pfade und Komponenten abzubilden. Herkömmliche Seitenanwendungen verwenden einige Hyperlinks, um Seitenwechsel und -sprünge zu erreichen. In der Vue-Router-Single-Page-Anwendung wird zwischen Pfaden gewechselt, dh zwischen Komponenten. Der Kern des Routing-Moduls besteht darin, die Zuordnungsbeziehung zwischen URLs und Seiten herzustellen.

• Verwandte Lernempfehlungen:

  Javascript-Lern-Tutorial

Das obige ist der detaillierte Inhalt vonWas nützt vue.router?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!