Javascript Vuex：在不同模块中共享嵌套模块，无重复

我正在使用Vuex作为状态管理器构建一个Vue.js应用程序。出于各种原因，我有一些状态必须在不同的组件之间共享，所以我创建了一个包含所有公共信息的嵌套状态，以便将其导入到两个不同的模块中

例如，我需要在另外两个不同的模块中使用

fileId

，我的方法如下：

// common file id store:
export default {
  state: {
    fileId: '',
  },
  actions: {
    setFileId({commit}, id) {
      commit('mutateFileId', id);
    },
  },
  mutations: {
    mutateId(state, id) {
      state.fileId = id;
    },
  },
};

然后我将该模块导入其他模块，例如：

// store 1 where I need the file id:
import fileIdModule from '@/store/modules/fileIdModule';

export default {
  modules: {
    fileIdModule,
  },
  actions: {
    whatEver({commit, dispatch}, param) {
      ...
      dispatch('setFileId', 1);
    },
  },
};

在另一家我仍然需要该文件ID的商店：

// store 2 where I need the file id:
import fileIdModule from '@/store/modules/fileIdModule';

export default {
  modules: {
    fileIdModule,
  },
  actions: {
    whatEver2({commit, dispatch}, param2) {
      ...
      dispatch('setFileId', 2);
    },
  },
};

我这么做的原因主要是，这段信息只需要2到3家商店，我的应用程序已经有8/9了，而且它还会变得更大

这种方法的问题是，由于我在两个不同的地方导入同一个模块，当我从该模块触发一个动作时，该动作将被复制，如果我在三个不同的位置导入模块，操作将执行三次，以此类推……如果我在操作主体中插入

控制台.log

，则证明这一点：

  actions: {
    setFileId({commit}, id) {
      console.log('mutating file id');
      commit('mutateFileId', id);
    },
  },

即使我仅仅从另一个模块触发该操作，

console.log

将被打印两次

---

有一种方法可以在不复制的情况下共享嵌套模块？

vuex不支持共享嵌套模块

您仍然可以从其他模块中提交并分派到它们，而不会出现问题，因此我认为这甚至不是必需的特性

请记住，当从

名称空间：true

模块中提交/分派时，需要将

{root:true}

作为第三个参数传递：

commit('setFileId', 2, {root: true})

---

是的，你绝对可以

使用名称空间。。。这将定义您正在运行的模块的版本。。。例如

如果将fileIdModule连接到ImageModule和DocumentModule

使用名称空间，您可以定义每个分派（'ImageModule/fileIdModule/setId'）

等等