无法从路由器中的 getter 获取数据。 [Vuex，类星体]

Posted 2023-02-22

【中文标题】无法从路由器中的 getter 获取数据。 [Vuex，类星体]

【英文标题】：Can't get data from getters in router. [Vuex, quasar]

【发布时间】：2020-08-20 02:53:59

【问题描述】：

我想在路由器中获取日期表单获取器。 我的商店中有 2 个模块：

export default function (/*  s-s-rContext  */) 
const Store = new Vuex.Store(
 modules: 
   customers,
   auth
 ,
 namespaced: true,
 strict: process.env.DEV
)

  return Store

这是我的 auth/index.js

import state from "./state";
import * as getters from "./getters"
import * as mutations from "./mutations"
import * as actions from "./actions"

export default 
 namespaced: true,
 state,
 mutations,
 actions,
 getters

我想检查我的用户是否经过身份验证，所以在转到组件之前我想检查它。

  
    path: '',
    component: () => import('pages/Index.vue'),
    beforeEnter: ifAuthenticated()
  ,

现在在 router/index.js 我声明我的函数

export function ifAuthenticated(to, from, next)
console.log(store.auth); //undefined
if (store.auth.getters.isAuthenticated) 
  next();
  return;

next("/login");
;

我如何调用我的 getter 来返回值，或者我如何调用我的 store 来获取 auth 模块？

【问题讨论】：

console.log(this.$store.auth) 怎么样？

打印未定义

console.log(this.$store)?

同样的结果

您应该在可以访问商店的地方动态添加此路线并定义如下路线：beforeEnter: (to, from, next) => ifAuthenticated(to, from ,next, this.store) // add fourth param 'store' to the ifAuthenticated

【参考方案1】：

那就是：

this.$store.getters['auth/isAuthenticated']

【参考方案2】：

我建议尝试几种可能性。 首先，看看这个答案（How to access the getter from another vuex module?）。

我会尝试：

this.$store.getters.isAuthenticated()
store.getters.isAuthenticated()
// don’t forget the ()

然后尝试添加 RootGetters 并再次测试相同的部分。 如果这不起作用，您可以尝试命名空间 (What exactly is namespacing of modules in vuex)

store.getters[‘auth/isAuthenticated’]

或者您可以尝试在您的商店中使用您的 authGetters 设置一个枚举

export enum authGetters 
  IS_AUTHENTICATED = 'isAuthenticated'


store.getters[authGetters.IS_AUTHENTICATED]