Vuex：存储模块循环依赖答案

【问题标题】：Vuex: Store module cyclic dependencyVuex：存储模块循环依赖
【发布时间】：2017-10-29 23:33:10
【问题描述】：

我有以下情况：

store/index.js

import moduleA from '@/store/module-a';
import moduleB from '@/store/module-b';

export default new Vuex.Store({
  modules: {
    A: moduleA,
    B: moduleB
  }
});

store/module-a.js

export default {
  namespaced: true,
  state: {
    val: // constructed using localStorage
  }
};

store/module-b.js

export default {
  namespaced: true,
  state: {
    val: // requires store/module-a.js state.val to construct
  },
  mutations: {
    add: function () {
      // requires store/module-a.js state.val
    }
  }
};

如果我尝试在模块 B 中访问 import store from '@/store，然后访问 store.state.A.val，我会得到一个循环依赖，其中 store --> moduleB --> store。

我可以在模块 B 内部构造 store.state.A.val，但这会重复逻辑，而且由于模块 A 是先加载的，如果我可以从模块 A 访问它会很好。这可能吗？

【问题讨论】：

听起来不太好用模块，主要用途是分离
@Phil 模块 A 是设置，由模块 B 和模块 C（不包括在这个问题中）以及任何未来的模块使用。我不确定我还能做什么。即使我将设置放在商店的“根”而不是它自己的模块中，似乎我仍然会遇到同样的问题。模块 B 和 C（以及未来的模块）确实需要分开。
如果你在不同的商店需要相同的状态，你应该把它抬起来

标签： javascript vue.js vuejs2 vuex

【解决方案1】：

我会将您的 b 商店的 val 构建为默认值，不包括设置中的任何信息。然后有一个突变或动作，从设置（a）中正确设置它。可能应该是一个 Action，因为 Mutations 只获得本地状态，而 Actions 获得一个包含 rootState 的上下文，您可以从中访问其他模块。或者，您可以只为b.val 使用吸气剂； getter 也可以访问rootState（和rootGetters）。

【讨论】：