如果目标重定向解析为相同路径，则 Vue 路由器 beforeEach 不会被调用

Question

router.push('/')当我用作注销的最后一步时，我遇到了问题。

/ redirect如果我从与 s相同的路由触发注销过程，则router.beforeEach不会触发，因此不会将用户重定向到，/login但仍然显示仅对登录用户可见的路由（用户不再是该路由）在注销过程结束时）。

{
  path: '/',
  redirect: 'foo'
},
{
  path: '/foo',
  name: 'foo',
  component: Foo,
  meta: {
    requiresAuth: true
  }
},

和

router.beforeEach((to, from, next) => {
  ...
  if(to.requiresAuth && userLoggedIn == false) 
    next('/login')
  ...

/foo因此，如果我从除预期之外的任何路由触发注销，但如果我从/foo用户触发注销，则不会重定向到/login.

我想这可能是为了使路由尽可能高效而有意为之，但在这种情况下，这绝对不是我想要的。

如何确保我的beforeEach路线守卫每次都会得到评估router.push/replace？

Answer 1

守卫router.beforeEach似乎只有在检测到导航发生变化时才会运行。由于您的情况下的路线相同，因此您必须通过在预期路线之前推送不同的路线来强制更改导航。预先推入一个空白空间效果很好。这无疑是很hacky的。

例如：

<button @click="$router.push(' '); $router.push('/')">Logout</button>

演示