Vuex几个比较核心的概念

1.State 单一状态树/单一数据源

档案，社保，公积金，婚姻信息，户口，医疗，文凭，房产记录等分布在不同系统进行管理。有天需要办某个业务（比如入户某个城市），会发现需要到各个对应的工作地点去打印、盖章各种资料信息，最后到一个地方提交证明信息无误。

这种保存信息方案，低效不方便管理，维护需要人力（庞大的工作量）

状态信息保存到多个Store对象中的，之后管理维护会特别困难。

所以Vuex也使用的单一状态树来管理应用层级的全部状态。

单一状态树能够让我们最直接的方式找到某个状态的片段，而且在之后的维护和调试中，也可以非常方便的管理和维护。

2.Getters

state数据必须经过一系列变化之后

 3.Mutation

Vuex的store状态的更新唯一方式：提交Mutation

Mutation主要包括两部分：字符串的类型（type）；一个毁掉函数（handler），该回调函数的第一个参数就是state

定义方式：

mutations:{
    increment(state){
        state.count++
    }
}

通过mutation更新

increment：function(){
    this.$store.commit('increment")
}

在通过mutation更新数据的时候，有可能我们希望携带一些额外的参数

参数被称为是mutation的载荷（payload）

案例参考：https://www.cnblogs.com/magic-world/p/15950307.html

4.Action

异步请求

5.Module

当应用变得非常复杂时，store对象可能变的相当臃肿。Vuex将store分割成模块（Module），而每个模块拥有自己的state、mutation、action、getters等

src/store/index.js中

const mouduleA = {
  state: {
        name:'张三'    
  },
  mutations:{},
  actions:{},
  getters:{},          
}

const mouduleB = {
  state: {
        name:'张三'    
  },
  mutations:{},
  actions:{},
  getters:{},          
}

页面中：
<h2>{{ $store.state.a.name }}</h2>

const store = new Vue.Store({
    state:{},
    mutations:{},
    actions:{},
    getters:{},
    modules:{
        a:moduleA
    }
})