switchMap 一个 Promise Observable 不起作用答案

【问题标题】：switchMap a Promise Observable doesn't workswitchMap 一个 Promise Observable 不起作用
【发布时间】：2018-09-26 02:09:30
【问题描述】：

环境：

rxjs6
es6

我编写了一个名为“getStatus$”的函数来模拟异步承诺，并将其转换为可观察对象。

当我订阅它时，它工作正常。

但我把它放到管道里，它不起作用。

有什么问题？

如何解决？

谢谢~

const { from, interval } = rxjs
const { switchMap } = rxjs.operators

const getStatus$ = () => from(new Promise(res => {
	setTimeout(() => {
  	res('zdl')
  }, 1000);
}));
// 1s
// 'first zdl'
// It works
getStatus$().subscribe(str => console.log('first', str));

// It doesn't work
// nothing output
interval(1000).pipe(
  switchMap(getStatus$)
).subscribe(str => console.log('second', str));

&lt;script src="https://cdn.bootcss.com/rxjs/6.2.0/rxjs.umd.min.js"&gt;&lt;/script&gt;

感谢Fan Cheung，两种方式：

interval(1000).pipe(
  mergeMap(getStatus$)
).subscribe(str => console.log('second', str));
// or
const getStatus$ = () => from(new Promise(res => {
    setTimeout(() => {
    res('zdl')
  }, 500);
}));

【问题讨论】：

如果源 observable 发出，switchmap 将取消内部 observable。即当间隔发射getsStatus$ 被取消时，请改用mergeMap
就是这个原因！非常感谢~mergeMap 没问题，当我把setTimout 改成500ms（小于间隔1000ms）也可以。
您能否将答案作为答案而不是作为问题的编辑:)？谢谢。
是的，当然~
大多数时候我不建议将 Promise 与 Observable 结合使用，因为 Promise 可以做的所有事情，也可以通过 Observable 来实现。除非现有的第 3 方库之一使用不可避免的 Promise 接口。

标签： javascript rxjs rxjs6

【解决方案1】：

感谢Fan Cheung，两种方式：

方法一，使用mergeMap操作符替换switchMap：

const { from, interval } = rxjs
const { mergeMap } = rxjs.operators

const getStatus$ = () => from(new Promise(res => {
	setTimeout(() => {
  	res('zdl')
  }, 1000);
}));

interval(1000).pipe(
  mergeMap(getStatus$)
).subscribe(str => console.log('second', str));

&lt;script src="https://cdn.bootcss.com/rxjs/6.2.0/rxjs.umd.min.js"&gt;&lt;/script&gt;

方法2，让getStatus$的时间比interval短，我改成500ms：

const { from, interval } = rxjs
const { switchMap } = rxjs.operators

const getStatus$ = () => from(new Promise(res => {
	setTimeout(() => {
  	res('zdl')
  }, 500);
}));

interval(1000).pipe(
  switchMap(getStatus$)
).subscribe(str => console.log('second', str));

&lt;script src="https://cdn.bootcss.com/rxjs/6.2.0/rxjs.umd.min.js"&gt;&lt;/script&gt;

【讨论】：