Vuex简单入门3：Mutations修改状态

更改 Vuex 的 store 中的状态的唯一方法是提交 mutation。Vuex 中的 mutation 非常类似于事件：每个 mutation 都有一个字符串的 事件类型 (type) 和 一个 回调函数 (handler)。

$store.commit( ) 方法

 store.js文件中更改如下

const mutations = {
  add (state, n) {
    state.count += n
  },
  reduce (state, n) {
    state.count -= n
  }
}

那么跟state一样，怎样简化方法，把方法保存到模板中，在调用时只写一个方法名呢，如下。

1. 引入mapMutations

import {mapState, mapMutations} from 'vuex'

2. 在方法中用数组的方式引入方法

methods: mapMutations(['add', 'reduce']),

3. 用的时候就不用写上面那么复杂了

<button @click="add(10)">+</button>
<button @click="reduce(2)">-</button>