Question

我需要一个解决方案来从3个不同的API调用中返回一个诺言。当前通过rxjs epics运行3个不同的API调用，并希望在所有3个调用完成后返回一个单个promise对象。无法理解如何使用Promise.all（）以及在何处调用它。我认为类似于Promise.all（）的是forkJoin（）。以下是我使用的史诗示例的一些虚拟数据。这都是在React中发生的。有人可以提供一个深入示例，说明如何在React中将Promise.all（）或forkJoin与史诗一起使用吗？

谢谢

  action$.ofType(GET_PROMISE).mergeMap(
    action =>
      action.payload.search_location === undefined ||
      action.payload.search_location.length === 0 ||
      action.payload.search_location === "" ||
      stateRegex.test(action.payload.search_location.toLowerCase()) === true
      ? api
         .fetchPromise(action.payload)
         .map(
           payload =>
           payload.value === undefined || payload.value.length === 0
                 ? getPromiseFail()
                 : getPromiseSuccess(payload)
           )

此刻，当我拿回Promise对象时，我正在更新状态，并使用来自2个不同API调用的其他两个Promise封装了该数据。由于它们是异步的，因此它们将在不同的时间返回。因此，我想在Web应用程序中显示任何数据之前合并所有3个调用。

Answer 1

您正确地研究了forkJoin。

这里粗略地重写了您的示例：

action$.ofType(GET_PROMISE).mergeMap(
  action =>
    // wait for all three fetches to complete
    forkJoin(
      api.fetchOne(action.payload),
      api.fetchTwo(action.payload),
      api.fetchThree(action.payload)
    )
    // now we have all three results as an array here:
    .map(([one, two, three]) => {
      // turn those results into an action
      return getPromiseSuccess(one, two, three)
    })
)

请注意，您共享的代码似乎使用了RxJS的过时版本，因此建议升级或至少在writing code中使用pipeable form。

希望这会有所帮助

在React.js中将Promise.all（）与rxjs史诗结合使用

1 个答案: