vuex(mapActions+mapGetter)配合v-model处理数据

业务场景：
elementui中的el-checkbox绑定的数据为一个存储在vuex当中的数据

// template
<el-checkbox v-model="showBasicData"></el-checkbox>

一开始，本来尝试直接用mapGetters中返回的getter作为数据源，类似如下形式：

computed: {
	...mapGetters([
		'showBasicData'
	])
}

但，会报错：
Computed property “XX” was assigned to but it has no setter.
原因：
v-model是双向绑定，而mapGetter中的showBasicData是单项数据流，只有getter，没有setter，故需要改写为以下形式：

computed: {
	...mapGetters([
		'showBasic'
	]),
	showBasicData: {
		get() {
			return this.showBasic
		},
		set() {
			this.resetBasic() // 这里的操作为对vuex中的action的调用
		}
	}
}

接下来，看下resetBasic这个函数怎么通过mapActions获取到：

methods: {
	...mapActions({
		resetBasic: 'user/resetBasic' // 这一步一定记得要加上module在action方法名前，不然无法获取到action
	})
}

这样，就可以正常获取到action，并可以将vuex中的数据用于v-model。

…mapActions及…mapGetters基本使用(Vuex官网)：

https://vuex.vuejs.org/zh/guide/actions.html
https://vuex.vuejs.org/zh/guide/getters.html