Häufige Probleme bei der Implementierung der Fortschrittsbalkenfunktion von vue Nprogress

importiere Vue von „vue“;
importiere VueRouter von „vue-router“;
Store aus „@/store“ importieren;
HomeLayout-Formular "@/views/home/layout" importieren;
importiere NProgress von „nprogress“;
importiere userCenter aus "./modules/userCenter";
importiere „nprogress/nprogress.css“
Vue.use(VueRouter);
NProgress.inc(0,2);
NProgress.configure({easing:'ease',Geschwindigkeit:2000,showSpinner:false,trickle:false})
const Routen = [{
	Weg:"/",
	Name:"Index",
	Umleitung:"/index"
},{
	Pfad:"/index",
	Name:'Index',
	Komponente:()=>importieren ('@/views/home/index.vue'),
	meta:{title:'Homepage'}
},{
	Pfad: „/home“,
	Name:'Home',
	Komponente:()=>import('@/views/home/main'),
	meta:{title:'Homepage'}
},{
	Pfad: '/login',
	Name:'Anmelden',
	Komponente:()=>importieren ('@/views/login'),
	meta:{title:'Anmelden'}
},{
	Pfad: '/register',
	Name: 'Registrieren',
	Komponente:()=>importieren('@/views/register'),
	meta:{title:'Registrieren'}
},{
	Pfad: '/404',
	Name:'404',
	Komponente:()=>import('@/views/errorPage')
},{
	Weg:'*',
	Weiterleitung: '/404'
}]
const router = neuer VueRouter({
	Modus: „Verlauf“,
	Routen
})
//Abfangen vor dem Routing router.beforeEach((to,from,next)=>{
	//Bevor die Seite springt, starten Sie den Fortschrittsbalken NProgress.start();
	//Einige Abfangvorgänge, Anmeldeberechtigungen usw.
	const token = window.localStorage.getItem('token'); //Cache vom lokalen Speicher abrufen if(to.meta.title){
		document.title = to.meta.title; //Ändere den Titel der Browser-Registerkarte in den Titel der Seite
	}
	store.commit('aktuelleSeiteändern',to.path);
	const reg = /[a-zA-Z]+\/$/;
	//Direkte Weiterleitung zu Routen, die keine Verifizierung erfordern if(!to.meta.requireAuth){
		wenn (reg.test(zu.Pfad)){
			weiter(zu.Pfad.ersetzen(reg,''));
			zurückkehren;
		}
		nächste();
		zurückkehren
	}
	wenn(token&&to.name!=='Index'){
		// Bereits angemeldet und die Seite, auf die umgeleitet werden soll, ist nicht die Anmeldeseite if(reg.test(to.path)){
			weiter(zu.Pfad.ersetzen(reg,''));
			zurückkehren;
		}
		next();//Sie können direkt springen }else if(token && to.name == 'Index'){
		//Die Seite, zu der Sie angemeldet sind und springen möchten, ist die Anmeldeseite if(reg.test(to.path)){
			weiter(zu.Pfad.ersetzen(reg,''));
			zurückkehren
		}
		next('/home');//direkt zur Homepage springen }else if(!token && to.name !='Index'){
		//Nicht angemeldet und die anzuspringende Seite ist nicht die Anmeldeseite next('/index');//Zur Anmeldeseite springen }else{
		wenn (reg.test(zu.Pfad)){
			weiter(zu.Pfad.ersetzen(reg,''));
			zurückkehren;
		}
		nächste()
	}
})
router.afterEach(to=>{
	NProgress.done();
	Fenster.scrollTo(0,0);
})
//Wiederholte Klicks auf das aktuelle Seitenmenü verarbeiten, Warnprobleme const originalPush = VueRouter.prototype.push;
VueRouter.prototype.push = Funktion push(Standort){
	gebe originalPush.call(diesen,Standort).catch(err=>err);
}
Standardrouter exportieren;

#nprogress .bar {
  Hintergrund: #f90 !wichtig; //benutzerdefinierte Farbe}