我理解的

五大模块 state mutations actions modules getter

主要的核心是要理解数据的传递流程（单向数据流）

组件有异步操作 就通过dispatch来触发action发起请求 然后再actions里派发 commit将数据给到mutations然后在mutations里操作数据 数据改变 页面自然改变

没有异步操作就通过 commit 将数据给到mutations然后在mutations里操作数据 数据改变 页面自然改变

state  他就是数据放数据的

类似

 

mutations 和 actions 都是对state数据的操作

前者可以理解为同步对state数据的处理

后者是异步对state数据的处理

mutations 处理数据需要定义函数 定义的函数接收两个参数

第一个是state数据（规定这样干） 第二个是传递的参数

 

在任何地方可以通过 this.$store.commit("plus"，5); 实现mutations派发  此时一个对state数据的操作结束。

actions是异步对数据的操作 其实就是在这里调接口获取数据，但是不对数据进行处理 ，因为在这里处理数据 vue  检测不到，页面绑定的数据不会进行改变。

所以这里进行了两步操作

先在actions定义一个方法 在这个方法里异步取到数据

写法： 函数名（参数一可以理解为store本身也就是this对象）

（第二个参数就是外面传递的数据没有的话就不用管它）

下面的参数是解构赋值 可以理解为

 

在方法里不直接处理state

第二步通过commit将数据传给mutations

mutations拿到数据在处理state，相当于又执行了一次 mutations对数据的操作。

actions的触发就是通过 this.$store.dispatch("loadList"); 触发参数需要就传

Moudels

这个做模块化拆分会用到，一般较小的项目用不到。就相当于全局store的子属性又是一个store 可以对他进行任何的上述操作。

Getters  

定义一个函数参数是state

返回一个对state中数据的处理类似计算属性（有return的）

用法就直接在页面绑定就完事了

 

mapState   mapGetters  mapMutations  mapActions

mapState作用是把state中的数据映射到计算属性上

mapMutations作用是把mutations中的数据映射到methdos中

mapActions作用是把actions中的数据映射到methods

mapGetters作用是把getters中的数据映射到计算属性上

这几个就是简化上面的用到的一些操作

 

mapState   mapGetters

写在计算属性里 参数是数组 里面是 state的属性 或者 getters里定义的方法 使用的时候就直接在页面用就行

 

mapMutations  mapActions

需要函数调用触发 所以写在  methods里

 

可以通过绑定事件来触发

可以这样写  @click=”plus(参数)”  这种写法可以向mutions传递数据  当然需要再传 不需要就不用传

Actions也是一样

 以上内容纯属个人理解大家看看就好