Question

我对RxJ陌生，我面临的问题对我来说似乎很复杂。所以，我有以下示例代码

const requests = [...Array(10)].map((_, i) => fetch(`${ ENDPOINT }/${ ++i }`));

from(requests).pipe(
  switchMap(response => response.json()),
  catchError(val => of(val))
).subscribe(value => { ... })

我有一个包含10个请求的数组，我希望在我的订阅处理程序中以某种方式处理它们（作为已解决的Promise值的数组）。当我仅传递一个请求而不是数组时，上面的示例工作得很好，但是当涉及到数组时，我会收到

TypeError：response.json不是函数

Answer 1

from仅接受1个承诺。您可以这样解决： from(Promise.all(requests))

并使用map代替switchMap。在switchmap中，您应该返回另一个可观察到的值，而不是一个值。

from(Promise.all(requests)).pipe(
  map(responses => responses.map(response => response.json())),
  catchError(val => of(val))
).subscribe(value => { ... })

不要忘记处理一个promise数组将返回值数组，因此您不应该只获取response.json（），而是对数组中的每个元素进行处理

Answer 2

您可以使用forkJoin。这里重要的是，在RxJS中，Promise总是变成可发出一次然后完成的Observable。因此，您甚至不需要进行任何转换。

const requests = [
  Promise.resolve(1),
  Promise.resolve(2),
  Promise.resolve(3),
];

forkJoin(requests).subscribe(console.log);

forkJoin通常与一系列Observable一起使用，但它也可以与Promises一起工作，且工作量为零。

实时演示：https://stackblitz.com/edit/rxjs-gcorux

RxJs：可从一系列承诺中观察到

2 个答案: