这在 2021 年对我有用

Question

就像在main.js中一样，我正试图从帮助函数文件访问我的商店：

@PostMapping(path="/Add") // Map ONLY GET Requests
public @ResponseBody PurchaseRequestLineItem addNewPurchaseRequestLineItem (@RequestBody String json) {
    // do whatever you want
}

但它记录了一个错误：

未捕获的TypeError：无法读取未定义的属性“getters”。

我试过了

import store from '../store'

let auth = store.getters.config.urls.auth

结果相同。

存储

this.$store.getters.config.urls.auth

如何在组件外部使用我的商店？

Answer 1

以下对我有用：

import store from '../store'

store.getters.config
// => 'config'

Answer 2

这在 2021 年对我有用

我尝试了很多不同的东西，似乎，至少在 Vue 3 中，这是有效的。这是一个示例商店：

export default {
  user: {
    bearerToken: 'initial',
  },
};

这是我的 Getters 文件：

export default {
  token: (state) => () => state.user.bearerToken,
};

在您的 .js 文件中，将该页面添加到您的 store\index.js 文件中。

import store from '../store';

为了访问 getter，只需记住它是一个函数（当您使用 mapGetters 时可能看起来不同。）

console.log('Checking the getters:', store.getters.token());

状态更直接：

console.log('Checking the state:', store.state.user.bearerToken);

Answer 3

将括号放在您的导入文件上，它应该可以正常工作

import { store } from '../store'

Answer 4

如果您使用命名空间模块，您可能会遇到我在尝试从商店检索项目时遇到的相同困难；

可能对您有用的是在调用 getter 时指定命名空间（示例如下）

import store from '../your-path-to-your-store-file/store.js'

console.log(store.getters.['module/module_getter']);

// for instance

console.log(store.getters.['auth/data']);

Answer 5

export default ( { store } ) => {
  store.getters...
}

Answer 6

尝试导入特定的js文件。

import store from '../store/index.js'

Answer 7

使用这种方法对我有用：

// app.js
import store from "./store/index"

const app = new Vue({
    el: '#app',
    store, //vuex
});
window.App = app;


// inside your helper method
window.App.$store.commit("commitName" , value);

访问js文件中的vuex存储

7 个答案:

这在 2021 年对我有用