vue框架知识：vuex模块化使用详解

目录结构

modules文件夹用于放模块文件

CoalGas.js内容

namespaced: true 命名空间

export default {
  namespaced: true,
  state: {
    coalGas: [],
    test01: 'test01'
  },
  getters: {},
  mutations: {
    intTest01(state, {
      name
    }) {
      state.test01 = name;
    },
  },
  actions: {},
}

index.js内容

import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
import CoalGas from './modules/CoalGas';
import DraughtFan from './modules/DraughtFan';
import AxleTree from './modules/AxleTree';

export default new Vuex.Store({
  state: {},
  getters: {},
  mutations: {},
  actions: {},
  modules: {
    CoalGas,
    DraughtFan,
    AxleTree
  }
})

使用

// 获取
console.log(this.$store.state.CoalGas.test01)
// 变更
this.$store.commit('CoalGas/intTest01', {
  name: 'QQ'
});

本人最新文章-vue中vuex的使用方法（详解）
官网vuex