vuex 模块化modules

当一个项目过大的时候 state中的状态太多了 就不好维护
所以需要modules，模块化来维护

import Vue from "vue";
import Vuex from "vuex";
import state from './state'
import getters from './getters'
import mutations from './mutation'
import actions from './actions'
import my from './modules/my'
import she from "./modules/she";
Vue.use(Vuex);


// 暴露出去的是store
export default new Vuex.Store({
//root store
  state,
  getters,
  mutations,
  actions,
  // 模块化
  modules: {
  // my store
      my,  
      she
  }
});

my.js文件：
使用namespaced，开启命名空间 避免属性冲突

export default {
  namespaced: true,//开启命名空间 避免属性名冲突
  state: {
      name:'晕车药',
  },
  mutations: {},
  actions: {},
  getters: {},
};

项目中引入：
使用命名“my”,来使用state

computed:{
            ...mapState("my",['name'])
},

跨模块commit mutations

my.js:
actions: {
      helloShe({commit},payload){
      //{root:true}， 设置root， 去从根组件寻找类型mutation，实现模块提交commit mutation
        commit('she/sheMutation',payload,{root:true});
      }
 }
 ====================
 she.js:
 mutations: {
        sheMutation(state,paylod){
            console.log(state,'she mutations yesyeysye');
        }
  },