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 пример .

Дело в том, что я не уверен, что понимаю, почему первая попытка не сработала, потому что в приведенном ниже примере она хорошо работает вне эпоса:

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

Это не потому, что вы используете эпопею. В первом примере используется .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, которые немедленно объединяются в цепочку.