问题：组件中使用 vuex 的值和修改值的地方？

以 8.3小节中vuex设置的值和方法为例，在 .vue 组件中使用：

直接获取、修改：

//state
this.$store.state.count
//getter
this.$store.getters.count
//调用 action 修改 state 值，不带参数
this.$store.dispatch('increment');
//调用 action 修改 state 值，带参数
this.$store.dispatch('increment',{value :123});

通过 辅助函数 获取、修改vuex：

vuex提供了三种辅助函数用于获取、修改vuex：
mapState、mapGetters、mapActions
即将vuex的变量或者方法映射到vue组件this指针上。

获取共享变量使用：

//使用state获取共享变量
<script type="text/javascript">
import { mapState } from 'vuex'
export default{
 computed : {
 ...mapState([
 'count',
 'buttonShow'
 ])
 }
}
</script>
//使用getters获取共享变量，
<script type="text/javascript">
import { mapGetters } from 'vuex'
export default{
 computed : {
 ...mapGetters([
 'count',
 'buttonShow'
 ])
 }
}
</script>
//使用actions修改共享变量
<script type="text/javascript">
import { mapActions } from 'vuex'
export default{
 methods : {
 	...mapActions({increment:'increment',decrement:'decrement'}),
 }
}
</script>

通过map获取到的变量或者方法，可通过 this 直接使用或者调用。

编辑器：

欢迎关注，有问题请咨询。