javascript - 在给定方法内的所有 promise 都已解决后执行方法

Question

在 Vue.js 组件中，我有一些使用 axios 的方法调用 API。

在不同的情况下，一旦此方法中的调用已解析，我需要执行一些代码，但我不想在 .then( ) 链接到 axios 调用。

methods: {
  callApi() {
    axios.get('/api')
     .then(() => {
       // call has resolved, request is done
     })
  },
  firstMethod() {
    this.callApi()
    // Need to wait for the call to resolve
    // Do something
  },
  secondMethod() {
    this.callApi()
    // Need to wait for the call to resolve
    // Do something else
  }
}

如您所见，firstMethod 和 secondMethod 都依赖于 callApi，但一旦请求完成，它们应该做不同的事情。我更喜欢将此逻辑拆分为不同的函数，而不是在 callApi 方法中使用条件。有没有办法做到这一点，而不必在callApi ?

Answer 1

让 callApi 返回 promise 链，然后在 firstMethod 和 secondMethod 中使用并返回它。

methods: {
  callApi() {
    return axios.get('/api')
     .then(() => {
       // call has resolved, request is done
     })
  },
  firstMethod() {
    return this.callApi()
    .then(() => {
      // Need to wait for the call to resolve
      // Do something
    })
  },
  secondMethod() {
    return this.callApi()
    .then(() => {
      // Need to wait for the call to resolve
      // Do something else
    })
  }
}

无论调用 callApi、firstMethod 还是 secondMethod 都应该检查失败并处理/报告它。

---

您的原始代码违反了 promise 规则之一:该函数应始终返回链或处理拒绝。 (是的，那是或 [99.9% 的时间]，而不是和。)