一、目录结构： src -> js -> modules

1. 在modules下新建文件夹，文件夹名称按模块功能命名

如：

modules ———— home  -> homeModule.js        |        ———— modal  -> modalModule.js

2. 在modules 下新建stores.js,注册所有状态

import homeState from './homeModule.js'import modalState from './modalModule.js'export const modules = {    modules: {        homeState,        modalState    }}

3. 在入口文件，如main.js中引用 stores.js

import Vue from 'vue'import Vuex from 'vuex'import router from '@/js/router'import { modules } from '@/js/modules/stores.js'import HelloWorld from './HelloWorld'Vue.config.productionTip = falseVue.use(Vuex)// 状态管理const store = new Vuex.Store(modules);new Vue({    el: '#app',    router,    store,    components: { HelloWorld },    template: '
    '})

二、homeModule.js结构

export default module = {    state: {        count: 1    },    mutations: {        increment(state, componentData) {            // 变更状态            state.count =  state.count + componentData        }    },    actions: {        // actions一般是处理异步逻辑        incrementData(context, componentData) {            context.commit('increment', componentData);        }    }}