vuex中的commit、dispatch于store中mutation和action的用法

建议先读文档再读次文vuex文档
在这里插入图片描述

computed: {
    
    ...mapState(['count']),...mapState(['showNum']),

},

methods: {
    
    ...mapMutations(['count']),...mapActions(['subAsync'])

}

commit的作用,就是调用store中某个mutation的函数。

this.$store.commit('函数名', 入参)

dispatch的作用,专门用来触发action

this.$store.dispatch('函数名')

store中,只有mutations中定义的函数,才有权利修改state中的数据

actions: {
    
    add(a, b) {
    
    

​		a.commit('addN', b)}

}

触发action的方法
在这里插入图片描述
在这里插入图片描述

Getter

只对数据起到包装作用,不会改变。

使用方法一:

gatters: {
    
    showNum(state) {
    
    return 'XXXXXXXXXXXXXXXXX'}

} 
<h1>{
    
    {
    
     &store.getters.showNum }}</h1>

使用方法二:

调用同action方法二相同。

<h1>{
    
    {
    
     showNum }}</h1>

猜你喜欢

转载自blog.csdn.net/weixin_46261261/article/details/113093296