时间戳

首页 > 解决方案 > 在 beforeEnter 路由中访问 VuexStore

vuejs2 - 在 beforeEnter 路由中访问 VuexStore

问题描述

我想将未经身份验证的用户重定向到“/ login”路由，当他尝试访问登录页面时，将身份验证用户重定向到“/”。

当用户登录时，我将他的信息放在商店中以便于检索。当没有用户登录时，商店上的用户认证信息仍然为空。

因此，在我的“/登录”的 beforeEnter 中，我想像这样重定向他：slight_smile：

beforeEnter: (to, from, next) => {
    if (store.getters.userAuthenticated != null) {
           next('/')
    } else {
           next()
    }
}

我的问题是 getter 中的 userAuthenticated 始终为空，即使我已登录。当我放置 console.log(store.getters) 时，我会在 userAuthenticated getter 中看到实际信息。

在此处输入图像描述

beforeEnter 中的数据似乎与商店中的实际数据不同步。

我会怎么做？

非常感谢 ！

标签： vuejs2vuexvue-router

解决方案

你就是这样做的

router.beforeEach((to, from, next) => {
  let nextParams
  let pageRequiresAuth    = to.matched.some(record => record.meta.requiresAuth)
  let userSignedIn        = store.getters['user/signedIn']

  if (pageRequiresAuth) {
    if (!userSignedIn) 
      nextParams = { path: paths.signInPath }  
  } else {
    if (userSignedIn)
      // don't let see auth pages after if user already signed in
      nextParams = { path: paths.afterSignInPath }
  }
  next(nextParams)
})

推荐阅读