Question

假设我们有两个按钮。第一个按钮以1000ms的延迟执行操作，而另一个按钮以2000ms的延迟执行操作。单击一个按钮时，我要等待其执行，只有在此之后，才允许其他按钮执行操作。

例如，单击按钮2，然后单击按钮1，只能导致执行动作2按钮（基本上，因为尚未执行action2，所以将忽略button1的动作）。如何使用rxjs库实现？

const btnOne = document.querySelector('#btn1');
const obs1 = rxjs.fromEvent(btnOne, 'click').pipe(
    rxjs.operators.delay(1000)
);

const btnTwo = document.querySelector('#btn2');
const obs2 = rxjs.fromEvent(btnTwo, 'click').pipe(
    rxjs.operators.delay(2000)
);

const generalObs = rxjs.merge(obs1, obs2).pipe(
    rxjs.operators.take(1),
    rxjs.operators.repeat()
);

generalObs.subscribe(result => console.log(result.target));

Answer 1

检查此堆叠闪电：它演示了如何使用exhaustMap运算符来实现您描述的行为。

https://stackblitz.com/edit/angular-a6spvp

不同的地图运算符是最重要且最常用的运算符。请查看下面的文章，以更好地说明如何使用exhaustMap，switchMap，concatMap或mergeMap。

https://blog.angular-university.io/rxjs-higher-order-mapping/

一旦您阅读了这篇文章，请使用我发布的stackblitz，并将exhaustMap替换为switchMap，concatMap或mergeMap，然后看如何影响行为；）< / p>

等待上一个动作执行

1 个答案: