如何更改 jquery Deferred 以使用 Vue nexttick？

Question

我需要更改這一點，因為我已閱讀 nextTick 與 deferred 相比是一個更好的選擇。

這是運行良好的原始代碼：

methods: {
    ...mapActions(['fetchOverdraftLogs', 'setOverdraftFilters', 'fetchUserEventsCsvFile']),
},
  computed: {
    ...mapGetters(['getOverdraftLogs'])
  },
...
        loadData: filters => {
          const d = $.Deferred()
          this.fetchOverdraftLogs({ params: this.filtersToSend(filters) })
            .then(res => {
              d.resolve(this.getOverdraftLogs)
              this.setFilterValues()
            })
          return d.promise()
        })
        }

但是，我無法使用 nextTick 進行修改：

loadData: filters => {
  this.fetchOverdraftLogs({ params: this.filtersToSend(filters) })
  this.$nextTick(() => {
    this.setFilterValues()
    this.getOverdraftLogs
  })
}

我需要確保網格在調用 API 后從 state 讀取數據。

你能幫忙嗎？

Answer 1

延遲模式通常是一種反模式，尤其是 ES 承諾。 它不是nextTick的替代品。 Promise 已經是異步的，立即解決的 promise 提供了一個小的延遲。 nextTick提供了一個足夠大的延遲來更新 DOM。

nextTick支持 Promise，但這里不需要。

它應該是：

    loadData: filters => {
      return this.fetchOverdraftLogs({ params: this.filtersToSend(filters) })
        .then(() => {
          this.setFilterValues()
          return this.getOverdraftLogs;
        })
    }

Vuex 操作不應該返回他們操作的數據，所以不應該有res 。