更改store中状态的唯一方法就是提交mutation
每个 mutation 都有一个字符串的事件类型 (type) 和 一个 回调函数 (handler)。这个回调函数就是我们实际进行状态更改的地方，并且它会接受 state 作为第一个参数;
mutation的回调函数不能直接调用,必须要用对应type调用store.commit方法 store.commit('increment')
mutation的载荷即除state外的参数,多为对象

mutations: {
  increment (state, payload) {
    state.count += payload.amount
  }
}
store.commit('increment', {
  amount: 10
})

mutation提交的另一种方式,直接使用包含type属性的对象,但不影响mutation中回调函数

store.commit({
  type: 'increment',
  amount: 10
})

使用常量替代 mutation 事件类型,同时把这些常量放在单独的文件中(多人协作常用!!!)

// mutation-types.js 
export const SOME_MUTATION = 'SOME_MUTATION'    // 定义常量

// store.js
import Vuex from 'vuex'
import { SOME_MUTATION } from './mutation-types'   //引入常量

const store = new Vuex.Store({
  state: { ... },
  mutations: {
    [SOME_MUTATION] (state) {  //使用
      // mutate state
    }
  }
})

Mutation 必须是同步函数

在组件中使用 this.$store.commit(‘mutation类型’) 提交 mutation，或者使用 mapMutations 辅助函数将组件中的 methods 映射为 store.commit 调用（需要在根节点注入 store）

import { mapMutations } from 'vuex'

export default {

  methods: {
    ...mapMutations([
      'increment',  // 将 `this.increment()` 映射为 `this.$store.commit('increment')`

      // `mapMutations` 也支持载荷：
      'incrementBy' // 将 `this.incrementBy(amount)` 映射为 `this.$store.commit('incrementBy', amount)`
    ]),
    ...mapMutations({
      add: 'increment' // 将 `this.add()` 映射为 `this.$store.commit('increment')`
    })
  }
}