如何在 RxJS 中取消 switchmap 链?
How to cancel switchmap chain in RxJS?
下面使用switchMap
...
Rx.Observable.timer(0, 1000)
// First switchMap
.switchMap(i => {
if (i % 2 === 0) {
console.log(i, 'is even, continue');
return Rx.Observable.of(i);
}
console.log(i, 'is odd, cancel');
return Rx.Observable.empty();
})
// Second switchMap
.switchMap(i => Rx.Observable.timer(0, 500).mapTo(i))
.subscribe(i => console.log(i));
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/5.5.6/Rx.min.js"></script>
... 产生以下输出:
0 is even, continue
0
0
1 is odd, cancel
0 // <-------------------- why?
0 // <-------------------- why?
2 is even, continue
2
2
3 is odd, cancel
2 // <-------------------- why?
2 // <-------------------- why?
4 is even, continue
.
.
.
我希望得到以下输出:
0 is even, continue
0
0
1 is odd, cancel
2 is even, continue
2
2
3 is odd, cancel
4 is even, continue
.
.
.
我预计第一个 switchMap
会取消下游的所有内容,每次 returns,我猜这是不正确的。
有没有办法实现所需的行为?
原因是 return 一个空的 observable 不会导致它切换到新的 observable,即第二个 switchMap 永远不会被调用。
一个非常hacky的解决方案是return一个你以后可以忽略的神奇值
const CANCEL = {};
Rx.Observable.timer(0, 1000)
// First switchMap
.switchMap(i => {
if (i % 2 === 0) {
console.log(i, 'is even, continue');
return Rx.Observable.of(i);
}
console.log(i, 'is odd, send CANCEL observable');
return Rx.Observable.of(CANCEL);
})
// Second switchMap
.switchMap(i => Rx.Observable.timer(0, 500).mapTo(i))
// Filter out cancelled events
.filter(i => i != CANCEL)
.subscribe(i => console.log(i));
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/5.5.6/Rx.min.js"></script>
下面使用switchMap
...
Rx.Observable.timer(0, 1000)
// First switchMap
.switchMap(i => {
if (i % 2 === 0) {
console.log(i, 'is even, continue');
return Rx.Observable.of(i);
}
console.log(i, 'is odd, cancel');
return Rx.Observable.empty();
})
// Second switchMap
.switchMap(i => Rx.Observable.timer(0, 500).mapTo(i))
.subscribe(i => console.log(i));
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/5.5.6/Rx.min.js"></script>
... 产生以下输出:
0 is even, continue
0
0
1 is odd, cancel
0 // <-------------------- why?
0 // <-------------------- why?
2 is even, continue
2
2
3 is odd, cancel
2 // <-------------------- why?
2 // <-------------------- why?
4 is even, continue
.
.
.
我希望得到以下输出:
0 is even, continue
0
0
1 is odd, cancel
2 is even, continue
2
2
3 is odd, cancel
4 is even, continue
.
.
.
我预计第一个 switchMap
会取消下游的所有内容,每次 returns,我猜这是不正确的。
有没有办法实现所需的行为?
原因是 return 一个空的 observable 不会导致它切换到新的 observable,即第二个 switchMap 永远不会被调用。
一个非常hacky的解决方案是return一个你以后可以忽略的神奇值
const CANCEL = {};
Rx.Observable.timer(0, 1000)
// First switchMap
.switchMap(i => {
if (i % 2 === 0) {
console.log(i, 'is even, continue');
return Rx.Observable.of(i);
}
console.log(i, 'is odd, send CANCEL observable');
return Rx.Observable.of(CANCEL);
})
// Second switchMap
.switchMap(i => Rx.Observable.timer(0, 500).mapTo(i))
// Filter out cancelled events
.filter(i => i != CANCEL)
.subscribe(i => console.log(i));
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/5.5.6/Rx.min.js"></script>