vuex中action什麼時候完成以及如何正確調用dispatch的思考

在項目中遇到關於action與dispatch使用的一些細節問題,通過搜索獲得了一些答案。
特地在此提出,若有錯誤還請指出,十分感謝~vue

問題1:若是action是異步的,那麼怎麼知道它何時完成?

  • 在vuex的官網給出了通用方法:
  • 圖片描述
  • (1) dispatch一個異步action一般接一個then()來跟進後續的邏輯
  • (2) 若是業務是有時序的多個action的異步組合,用async/await的寫法會更直觀一點

問題2: 若是action是同步的,是否還須要使用then來接dispatch的後續操做?

提出這個疑問主要是由於之前一直認爲只要dispatch的action是同步的(僅僅commit了一個state),就能夠當作是同步的函數進行使用
但在看到vuex的源碼的dispatch實現的代碼就知道其實dispatch實際上是一個異步函數git

dispatch (_type, _payload) {
   ...
    return result.then(res => {
      try {
        this._actionSubscribers
          .filter(sub => sub.after)
          .forEach(sub => sub.after(action, this.state))
      } catch (e) {
        if (process.env.NODE_ENV !== 'production') {
          console.warn(`[vuex] error in after action subscribers: `)
          console.error(e)
        }
      }
      return res
    })
}

代碼能夠看到dispatch返回的是一個promise,因此它是一個異步函數,因此即便action裏面的邏輯是同步的,若是dispatch以後須要接着用到commit的state變量,仍然須要使用異步寫法(dispatch().then(()=> {}))來實現。github

  • 注:用同步的寫法看起來好像state也是對的,但我認爲是由於個人業務場景io使用率不是很高因此"看起來是對的",在高io的場景下state可能會由於延時而沒有及時更新

若有錯誤,請不吝提出,謝謝!vuex

相關文章
相關標籤/搜索