vuex在action中提交commit异步事件问题

在开发过程中遇到一个问题,就是在action中提交的commit执行是异步事件。

先看代码:

// action.js
sign_in({ commit }, user) {
    // 触发登录状态
    commit({
      type: 'sigin_in',
      payload : {
          user  
      }
    });
    console.log("++++++");
},



// mutations.js
async sigin_in(state, { payload }) {
    await axios.post("api/login",payload.user);

    console.log("------");
}


//输出
++++++
------

如上所示,如果在mutations中使用async/await的话就会使得commit变成异步函数。

解决办法:

一、将axios异步进程放在action中执行。

二、不要使用async/await,在axios的then中进行业务逻辑,代码如下:

sigin_in(state, { payload }) {
    axios.post("api/login",payload.user).then(res => {
        // do somthing...
        
    });
}

官方的说法是不建议将异步事件放在mutations中执行,但如果情况特殊,只能在mutations中进行异步的话只有使用上面的方法了。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章