$router.push 不尊重路由元字段

Question

当像这样使用$router.push 时：

this.$router.push({name: 'Home'})

...似乎我的路线元字段没有被识别。这是我的路线元字段以及我如何称呼它们：

路由元字段

router.beforeEach((to, from, next) => {
  if (to.matched.some(record => record.meta.requiresAuth)) {
    // this route requires auth, check if logged in
    // if not, redirect to login page.
    if (!auth.user.authenticated) {
      next({
        path: '/login'
      })
    } else {
      next()
    }
  } else {
    next() // make sure to always call next()!
  }
})
router.beforeEach((to, from, next) => {
  if (to.matched.some(record => record.meta.preventAdmin)) {
    // this route shouldn't be available for admin, check role
    // if so, redirect to admin area.
    if (auth.user.role === '1') {
      next({
        path: '/admin/users'
      })
    } else {
      next()
    }
  } else {
    next() // make sure to always call next()!
  }
})

路线

routes: [
  {
   path: '/',
   name: 'Home',
   component: Home,
   meta: { requiresAuth: true, preventAdmin: true }
  },
]

如果我在特定路线上刷新，它们会按预期工作。

在使用$router.push 时，我是否必须做一些事情来确保我的路由元字段正常工作？

Answer 1

您可以这样构建您的路由器视图：

<router-view :key="$route.path"></router-view>

在页面路由上达到与页面刷新相同的结果（至少对于您的路由器视图的内容）。我希望这样做可以解决问题，但如果没有，请告诉我。