使用switchMap运算符来代替嵌套订阅。下面是一个示例代码:
import { fromEvent } from 'rxjs';
import { switchMap, map } from 'rxjs/operators';
const button = document.querySelector('button');
const output = document.querySelector('#output');
// 两个可观察对象, 一个为定时器,每隔2000毫秒输出一个值; 一个为点击事件,点击时触发
const interval$ = fromEvent(button, 'click')
.pipe(
switchMap(() => interval(2000)),
map((value: number) => `第${value + 1}次点击`)
);
// 订阅(interval$)
interval$.subscribe((res) => {
console.log(res);
output.innerHTML += res + '
';
});
此示例代码为不进行嵌套订阅,打印出每次按钮点击的输出。在此示例中,我们使用switchMap运算符将点击事件与定时器流链接在一起,而不是嵌套。