如何有效地链住RxJS的可观察项?

我知道这个问题已经在这里以各种形式被问过几次,但我正在努力让这个问题完全按照我的要求来做。

在NodeJS中,我有一个文件上传服务,它将图像存储在一个临时文件夹中。然后,我有一些函数来调整图像的大小,使其成为常规的网页尺寸和缩略图,然后保存到上传文件夹,然后另一个函数来删除临时文件。这三个函数都会返回Observables。

我想要的是按顺序运行这些观测值,比如说,我想确保A和B有足够的时间来处理。

observableA().subscribe((result) => //do something here ) // Resize the photo
observableB().subscribe((result) => //do something here ) // Create a thumbnail
observableC().subscribe((result) => //do something here ) // Delete the temporary file

我想确保在执行C(删除临时文件夹)之前,A和B已经完成。我不想嵌套这些Observables。A和B都会返回一些我想要的数据。

哪个是实现这个目标的最佳rxJS操作符?

解决方案:

你可以使用 forkJoin 合并前两个观测值(它们将并行运行),然后使用 switchMap 切换到第3个观测点。

import { of, timer, forkJoin } from "rxjs";
import { switchMap, delay, map } from "rxjs/operators";

const observableA = of("resized photo").pipe(delay(300));
const observableB = of("thumbnail").pipe(delay(250));
const observableC = of("temp deleted").pipe(delay(100));

const result = forkJoin(observableA, observableB).pipe(
  switchMap(([resultA, resultB]) => {
    console.log(resultA, resultB);
    console.log('now to observableC');
    return observableC.pipe(map(resultC => [resultA, resultB, resultC]));
  })
);
result.subscribe(x => console.log(x));

请在 秒杀 (不要忘了打开控制台看一下。console.log 输出)。)

RxJS文档中也有一个方便的页面,可以帮助选择合适的操作员。operator-decision-tree

给TA打赏
共{{data.count}}人
人已打赏
未分类

从第二个数组中获取'name'值

2022-9-8 23:50:23

未分类

如何在Cloud Firestore中对数组进行逻辑AND的复合查询?

2022-9-9 0:00:17

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索