码迷,mamicode.com
首页 > 其他好文 > 详细

Vuex action 异步函数

时间:2020-07-04 01:23:58      阅读:107      评论:0      收藏:0      [点我收藏+]

标签:col   tools   class   pat   发布   text   addition   异步   src   

action与Mutation类似,Mutation用于同步函数,action用于异步函数。

异步函数需要通过先action再传递到mutations,这样才能被Devtools记录下来。

使用方法

1 组件发布行为 dispatch

src\App.vue

    methods:{
      addition(){
        this.$store.commit(INCREMENT)
      },
      updateInfo(){
       // this.$store.commit(‘updateInfo‘)
        this.$store.dispatch(‘aUpdateInfo‘)
      }
    }

2 传入actions 

src\store\index.js

  actions:{
    //context 上下文
    aUpdateInfo(context){
      setTimeout(()=>{
        context.commit(‘updateInfo‘)
      },1000)
    }
  },

3 传入mutations

src\store\index.js

 mutations:{
    updateInfo(state){
      state.info.name = ‘喵喵‘
}
}

结果

技术图片

这样的异步操作就可以在Devtools里捕获到了

 

Vuex action 异步函数

标签:col   tools   class   pat   发布   text   addition   异步   src   

原文地址:https://www.cnblogs.com/polax/p/13233375.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!