vuex多模块编程

1：多模块编程主要是针对于大型项目

//文件目录结构

//store文件夹
    //index.js集成模块
    //actions.js
    //mutations.js
    //modules
       //module1.js
       //module2.js 

const moduleA = {
    state:{},
    actions:{},
    mutations:{},
    getters:{}
}
const moduleB = {
    state:{},
    actions:{},
    mutations:{},
    getters:{}
}

import mutations from './mutations.js'
import actions from './actions.js'
import gettersfrom './getters.js'


import moduleA from './modules/moduleA'
import moduleB from './modules/moduleB'


export default new Vuex.Store({
    actions,
    mutations,
    getters,
    modules:{
        moduleA:moduleA,
        moduleB: moduleB
    }
})

使用vuex多模块编程之后==总state状态结构

/*
    总state状态数据结构
    {
        moduleA:{},
        moduleB:{}
    }
*/
//不适用全局变量第一次调用返回1第二次调用返回2
(function () {
    let count = 0
    return fn = function () {
        count++
        return count%2===0?2:1
    }
})()

组件内部使用mapState时注意

computed:{

    ...mapState({
        key: state => state.ModuleName.key,
        key2: state => state.ModuleName2.key2
    })


}