vuex中的模块化开发

1.模块化，每个模块拥有自己的state、mutation、action、getter

const moduleA = {
   
  state: () => ({
    ... }),
  mutations: {
    ... },
  actions: {
    ... },
  getters: {
    ... }
}

const moduleB = {
   
  state: () => ({
    ... }),
  mutations: {
    ... },
  actions: {
    ... }
}

const store = new Vuex.Store({
   
  modules: {
   
    a: moduleA,
    b: moduleB
  }
})

store.state.a // -> moduleA 的状态
store.state.b // -> moduleB 的状态

2.对于模块内部的mutation和getter，接收的第一个参数是模块的局部状态对象

const moduleA = {
   
  state: () => ({
   
    count: 0
  }),
  mutations: {
   
    increment (state) {
   
      // 这里的 `state` 对象是模块的局部状态
      state.count