Observable.merge 在史诗中表现不同

Question

在 React/Redux 应用程序中，我使用 Redux Observable 并且我想要一个史诗来输出两个不同的动作。

首先，我尝试了这个：

const epic1 = action$ =>
  action$
    .ofType("A")
    .mapTo({ type: "B" })
    .merge(Observable.of({ type: "C" }));

因为它不起作用，我不得不切换到：

const epic2 = action$ =>
  action$
    .ofType("D")
    .mergeMap(value =>
      Observable.merge(
        Observable.of({ type: "E" }),
        Observable.of({ type: "F" })
      )
    );

查看此 CodeSandbox example。

问题是，我不确定为什么第一次尝试不起作用，因为在下面的示例中，它在史诗之外运行良好：

var observable = Observable.of({type: "A"})
  .mapTo({type: "B"})
  .merge(Observable.of({ type: "C" }));

observable.subscribe(value => {
  this.setState(prevState => ({
    values: [...prevState.values, value]
  }));
});

知道为什么它在史诗中的表现不同吗？

Answer 1

这不是因为您正在使用 epics。第一个示例使用 .merge(Observable.of({ type: "C" }))，因此它会立即订阅 Observable.of({ type: "C" })，而您订阅 epic1。但是，您使用的是 redux，因此订阅发生在 redux 内部的某处，并且 Observable.of({ type: "C" }) 立即发出，您甚至不知道它何时发生。然后任何其他操作 .ofType("A") 都不会改变，因为 .merge(Observable.of({ type: "C" })) 已经发出了它的唯一值。

这也解释了为什么您在问题末尾提到的示例按预期工作。

另一方面，当您使用 mergeMap 时，会在源可观察对象的每次发射时调用回调（在每个 action$.ofType("D") 操作上）。它会创建新的 E 和 F 操作，这些操作会立即合并到链中。

Observable.merge 在史诗中表现不同

Observable.merge behaves differently in an epic

rxjs

reactjs

redux

redux-observable