vuex中的action和mutaion的理解

1/Actions 函数接受一个与 store 实例具有相同方法和属性的 context 对象，因此你可以调用 context.commit 提交一个 mutation，或者通过 context.state 和 context.getters 来获取 state 和 getters

期中dispach()实现异步提交，而commit（）实现同步提交；dispach("方法名"，值)；commit(“方法名”，值)

action中的函数只包含一个context参数，多余的参数将被忽略。

context的话就相当于state的父亲，上一级，包含着state中的所有属性

context:{
        state,   等同于store.$state，若在模块中则为局部状态
        rootState,   等同于store.$state,只存在模块中
        commit,   等同于store.$commit
        dispatch,   等同于store.$dispatch
        getters   等同于store.$getters
}

常规写法调用的时候会使用context.commit，但更多的是使用es6的变量解构赋值，也就是直接在参数的
位置写自己想要的属性，如：{commit}。

• Action 类似于 mutation，不同在于：
• Action 提交的是 mutation，而不是直接变更状态。
• Action 可以包含任意异步操作。

2/mutations里面的函数必须带state的参数，这样就可以把state中的值传入到函数中

mutation：（必须是同步函数）
更改store中state值的唯一方法就是提交mutation，每个 mutation 都有一个字符串的 事件类型 (type) 和 一个 回调函数 (handler)。这个回调函数就是我们实际进行状态更改的地方，并且它会接受 state 作为第一个参数：

你可以向 store.commit 传入额外的参数，即 mutation 的 载荷（payload）：在大多数情况下，载荷应该是一个对象，这样可以包含多个字段并且记录的 mutation 会更易读：

 mutations: {
    addNum(state,Payload) { 
      state.num +=Payload.amount
    }
}

不能直接调用一个 mutation handler。这个选项更像是事件注册：“当触发一个类型为 increment 的 mutation 时，调用此函数。”要唤醒一个 mutation handler，你需要以相应的 type 调用 store.commit 方法：

//页面中的操作(一、不带参数)
 methods:{
    add(){
      this.$store.commit('addNum')
    }
  }
//二、带参数的情况下
data(){
argument:{
  amount:10
},
methods:{
    add(){
      this.$store.commit('addNum',this.arguments)
    }
  }

 

区别：

action和mutation都可以改变state中数据的状态，但是action可以处理异步函数可以在devtool中追踪数据变化，而mutation只可以处理同步函数，当处理异步函数的时候检测不到数据变化；