Vuex子模块调用子模块的actions

在Vuex中，子模块可以通过dispatch函数调用同一模块内的actions，或者通过模块路径调用其他模块的actions。

假设有如下模块结构：

store
├── index.js
└── modules
    ├── moduleA.js
    └── moduleB.js

在moduleA.js中调用moduleB的someAction：

// moduleA.js
const moduleA = {
  actions: {
    someAction({ dispatch, commit }, payload) {
      // 调用同模块的另一个action
      dispatch('someOtherAction', payload);
 
      // 调用不同模块的action
      dispatch('moduleB/someAction', payload);
    }
  }
};
export default moduleA;

在moduleB.js中定义someAction：

// moduleB.js
const moduleB = {
  actions: {
    someAction({ commit }, payload) {
      // 你的action逻辑
    }
  }
};
export default moduleB;

在store/index.js中注册模块：

import Vuex from 'vuex';
import moduleA from './modules/moduleA';
import moduleB from './modules/moduleB';
 
const store = new Vuex.Store({
  modules: {
    moduleA,
    moduleB
  }
});
 
export default store;

在组件中调用moduleA的someAction：

this.$store.dispatch('moduleA/someAction', payload);

确保在调用dispatch时使用正确的模块路径和动作名称。