访问组件 vuejs 之外的存储答案

【问题标题】：access store outside of component vuejs访问组件 vuejs 之外的存储
【发布时间】：2018-05-14 06:27:57
【问题描述】：

我有一个用于配置我的 OpenID Connect 身份验证的文件

export const authMgr = new Oidc.UserManager({
  userStore: new Oidc.WebStorageStateStore(),
  authority: **appsetting.oidc**
})

我想访问我的状态以获取 appsetting 的值。

我这样做了：

import store from './store'

const appsetting = () => store.getters.appsetting

但我的 appsetting 总是返回 undefined

我错过了什么？

商店：

app.js

const state = {
  appsetting: appsetting,
}

export {
  state 
}

getters.js

const appsetting = state => state.appsetting

export {
  appsetting
}

index.js

export default new Vuex.Store({
  actions,
  getters,
  modules: {
    app
  },
  strict: debug,
  plugins: [createLogger]
})

当我打印store.getters 的值时，它会返回：

{
  return __WEBPACK_IMPORTED_MODULE_2__store__["a" /* default */].getters;
}

没有实际的商店对象

【问题讨论】：

【解决方案1】：

尝试使用大括号导入“商店”

import {store} from '../store/index'

store.getters.appSettings

另一种选择是从 vue 属性访问

import Vue from 'vue'

Vue.store.getters.appSettings

【讨论】：

如何访问嵌套模块的 getter（以及传递参数）的示例是 const hasTextAutomationEnabled = store.getters['account/hasFeature']('text-automation');（您通常可以使用点表示法，但由于模块是用正斜杠引用的“ /”，通过带方括号的数组语法更容易获取属性。如果您的getter没有参数，请不要将“（param）”放在最后。）
谁能解释一下为什么我们需要使用大括号？
使用了 store 周围的大括号，因为它不是默认导出。如果它是默认导出，则不要使用大括号。在此示例中，OP 使用 export { store } 而不是 export default store
第一个效果很好，但Vue.store.getters.appSettings 似乎不适合我，奇怪...
两者都不适用于我的情况..我的商店中有一个模块，但是访问它们会出现错误，我尝试了上面的两个选项但不起作用，我正在使用打字稿