Heim > Artikel > Web-Frontend > Welche verschiedenen Modi des Vue-Routings gibt es?
Vue-Routing verfügt über drei Modi: Hash, Verlauf und Zusammenfassung. Unterschiede: 1. Das Zeichen # erscheint im URL-Pfad im Hash-Modus, jedoch nicht in anderen Modi. 2. Änderungen im Hash-Wert lösen das Hashchange-Ereignis aus, jedoch nicht in anderen Modi. 3. Die gesamte Adresse im Verlaufsmodus wird neu geladen und Verlaufsdatensätze können gespeichert werden, was praktisch ist. Vorwärts und rückwärts, andere Modi nicht.
Die Betriebsumgebung dieses Tutorials: Windows7-System, Vue3-Version, DELL G3-Computer.
Vue-Routing hat tatsächlich drei Modi:
Hash: Verwenden Sie den Hash-Wert der URL als Route. Unterstützt alle Browser.
Verlauf: Seit HTML5-Verlaufs-API und Serverkonfiguration
Zusammenfassung: Unterstützt alle Javascript-Ausführungsmodi. Wenn festgestellt wird, dass keine Browser-API vorhanden ist, wechselt das Routing automatisch in diesen Modus.
vue-router verwendet standardmäßig den Hash-Modus, d. h. die folgende URL wird angezeigt:, mit einem #-Zeichen in der URL
Wir können den folgenden Code verwenden, um ihn in den Verlaufsmodus zu ändern:
import Vue from 'vue' import Router from 'vue-router' const userInfo = () => import('@/views/userInfo') Vue.use(Router) export default new Router({ mode: 'history',//hash abstract routes: [ { path: '/user-info/:userId', component: userInfo } ] })
Unterschied
Hash-Modus:
Das #-Zeichen erscheint im URL-Pfad
Der Hash-Wert ist nicht in der HTTP-Anfrage enthalten. Er wird vom Front-End-Routing verarbeitet. Daher wird die Seite nicht aktualisiert, wenn der Hash-Wert geändert wird. Es wird keine Anfrage an den Server gesendet. Änderungen am Hash-Wert lösen das Hash-Änderungsereignis aus. Verlaufsmodus:
HTML5-API (von alten Browsern nicht unterstützt) und HTTP-Serverkonfiguration. Wenn keine Hintergrundkonfiguration vorhanden ist, wird 404 angezeigt Die Seite wird aktualisiert
Das obige ist der detaillierte Inhalt vonWelche verschiedenen Modi des Vue-Routings gibt es?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!