Normalerweise möchten wir, dass während des Seitensprungladens oben auf der Seite ein Fortschrittsbalken angezeigt wird.
(1) Abhängigkeiten herunterladen
npm install nprogress --save
(2) Eingeführt in index.js im Router
NProgress aus 'nprogress' importieren
importiere 'nprogress/nprogress.css'
(3) Verwenden Sie index.js im Router über Routing Guards
router.beforeEach((to, from, next) => {
NProgress.start() // starten
nächste()
})
router.afterEach((to, from) => {
NProgress.done() // Ende
})
(4) Passen Sie die Farbe des Fortschrittsbalkens auf der app.vue-Seite an
/* Passen Sie die Farbe des Fortschrittsbalkens an */
#nprogress .bar {
Hintergrundfarbe: rot !important;
}