Vue/Vue-bulma - nprogress：进度条永远加载守卫/重定向

Question

nprogress在其他方面工作得很好，但在重定向到/登录时永久旋转。我试图showProgressBar：false无济于事。

如果用户已经登录，他们将被重定向到/仪表板，如果他们不会被重定向到/登录。

我的代码如下所示：

const routes = [ 
    {path: '/', name: 'root', redirect: { name: 'login' }, meta: {showProgressBar: false}}, 
    {path: '/login', component: LoginPage, name: 'login', beforeEnter: loggedIn, meta: {showProgressBar: false}}, 
    {path: '/dashboard', component: DashboardPage, name: 'dashboard', meta: { requiresAuth: true }}, 
    {path: '/editor', component: PhoneEditorPage, name: 'editor', meta: { requiresAuth: true }}, 
    {path: '/usersettings', component: PinPasswordPage, name: 'pinpassword', meta: { requiresAuth: true }}, 
    {path: '/callforwarding', component: CallForwardingPage, name: 'callforwarding', meta: { requiresAuth: true }}, 
    { name: 'dropdown', path: '/dropdown', component: Dropdown, meta: { requiresAuth: true }} 
] 

const router = new VueRouter({ 
    linkActiveClass: 'active', 
    mode: 'hash', 
    routes 
}) 

function loggedIn (to, from, next) { 
    const authUser = JSON.parse(window.localStorage.getItem('authUser')) 
    if (authUser && authUser.auth) { 
    next({name: 'dashboard'}) 
    } else { 
    next() 
    } 
} 

router.beforeEach((to, from, next) => { 
    if (to.meta.requiresAuth) { 
    const authUser = JSON.parse(window.localStorage.getItem('authUser')) 
    if (authUser && authUser.auth) { 
     next() 
    } else { 
     next({name: 'login'}) 
     this.nprogress.done() 
    } 
    } 
    next() 

谢谢您的时间。

Answer 1

不是简单的回答，而不在行动中看到的代码，但是，你可以尝试反转调用this.nprogess.done()和next(...)这样的：

router.beforeEach((to, from, next) => { 
    if (to.meta.requiresAuth) { 
    const authUser = JSON.parse(window.localStorage.getItem('authUser')) 
    if (authUser && authUser.auth) { 
     next() 
    } else { 
     this.nprogress.done(); // <- HERE 
     next({name: 'login'}) 
    } 
    } 
    next() 
} 

因为next（）调用移动背景下新的组件，并我不确定在正确的时刻会打电话给nprogress。