>[success] # mutations-- 扩展 ~~~ 1.上面的参数使用理解章节简单的示范了mutations 2.官方文档中还给了更简单的使用方法，我们可以不使用 this.$store.commit('mutations 中的方法名','参数对象'),这种方式获取值,使用 提供的'mapMutations 辅助函数' ~~~ >[info] ## mapMutations 辅助函数 ~~~ 1.Vuex 给我们提供了辅助函数，使用的时候只需要引入辅助函数即可: import { mapMutations } from 'vuex' 2.上面的引入方式用了es6的结构赋值，相当于下面的写法: import vuex from 'vuex' const mapMutations = vuex.mapMutations ~~~ >[danger] ##### 官方给的几种写法 ~~~ 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')` }) } } ~~~ >[danger] ##### 使用mapMutations 辅助函数 改造参数理解章节案例 ~~~ 1.改造的时候注意mapMutations 必须放到methods 调用，调用后直接当， 放在使用即可 ~~~ ~~~ <template> <div> <p>{{appNameWithVersion}}</p> <p>{{timee}}</p> <button @click="handleChangeAppVersion">点击</button> <button @click="handleChangetime">时间</button> </div> </template> <script> import { mapGetters,mapState, mapMutations} from 'vuex' import state from "../store/state"; export default { name: "store", data(){ return{} }, methods:{ ...mapMutations (['SET_APP_NAME',]), handleChangeAppVersion(){ this.SET_APP_NAME({appName:"111"}) }, handleChangetime(){ this.$store.commit({ type:'SET_Time', }) }, }, computed:{ ...mapState(['timee']), ...mapGetters(['appNameWithVersion',]), } } </script> <style scoped> </style> ~~~