Vue/Vuex (mutations) 核心概念 方法说明、辅助函数 mapMutations使用方法

一. mutations (用来修改数据)

语法:

// 定义 --> main.js

const  store = new Vue.store({
  mutations：{
      mutation名：function(state ,载荷形参) {
  
  }
}
})

//接收 --> App.vue

this.$store.commit('mutation名', 载荷实参 )

作用: 负责修改state数据 mutations是修改state的唯一方式 

理解: mutations里面装着一些改变数据方法的集合 ，就是把处理数据逻辑方法放在 mutations里面 让数据和视图分离

注意:

1.state中的所有数据不允许在其他地方修改 必须通过 mestaions

2.在使用vuex对项目状态进行管理时 只能使用commit来提交

说明: 

1. mutations是store对象的一个属性 mutations被用于更新store内存放的所有状态

2. commit: 提交可以在组件中使用 this.$store.commit('mutation名', 载荷实参 ) 提交 mutations，或者使用 mapMutations 辅助函数将组件中的 methods 眏射为 store.commit 调用

二. 辅助函数  mapMutations

语法: 

//导入

import  { mapMutations } from 'vuex'

//展开

methods: {
    ...mapMutations(['mutations内函数名'])
}

//使用

<标签> {{ mutations内函数名 }} </标签>

作用: mapMutations是vuex的mutations 的辅助函数 用于在组件中眏射 mutations 内的方法 以便于在该组件中使用 mutations 里的方法 (说白了 mapMutations就是mutations的语法糖 ) 

注意: mapState 和 mapGetter 是眏射为计算属性 获取数据 而 mapMutations是眏射组件 methods方法 修改数据