Question

我需要使用redux-observable以某种顺序发送一些操作，但是，它只需要最后一次操作即可发送。请参阅示例：

export const fetchClientsEpic = (action$, { dispatch }) =>
  action$
    .ofType(fetchClients)
    .mapTo(fetchClientsPending(true))
    .mergeMap(() => {
      return ajax
        .getJSON('some/get/clients/api')
        .map((clients: IClient[]) => {
          return fetchClientsSuccess(
            map(clients, (client, index) => ({
              key: index,
              ...client,
            })),
          );
        });
    });

fetchClientsSuccess已发送给客户，但fetchClientsPending没有，我完全不明白为什么。我可以使用dispatch，因为我在params中得到它，但我觉得这不是很好的解决方案（？）。我应该在流中完成它。我开始使用RxJs和redux-observable。有可能吗？

Answer 1

运算符是Observables的链，其中一个流的输入是另一个流的输出。因此，当您使用mapTo时，您将一个动作映射到另一个动作。但是然后你的mergeMap映射Pending action并将其映射到执行ajax等的其他内部Observable，从而有效地抛弃Pending操作。因此，将RxJS视为数据流经（流）的一系列管道

虽然没有灵丹妙药，但在这种特殊情况下，您可以通过在内部Observable末尾使用startWith来实现您想要实现的目标

export const fetchClientsEpic = (action$, { dispatch }) =>
  action$
    .ofType(fetchClients)
    .mergeMap(() => {
      return ajax
        .getJSON('some/get/clients/api')
        .map((clients: IClient[]) => {
          return fetchClientsSuccess(
            map(clients, (client, index) => ({
              key: index,
              ...client,
            })),
          );
        })
        .startWith(fetchClientsPending(true)); // <------- like so
    });

这实际上与使用concat和of(action) first一样，只是简写。

export const fetchClientsEpic = (action$, { dispatch }) =>
  action$
    .ofType(fetchClients)
    .mergeMap(() => {
      return Observable.concat(
        Observable.of(fetchClientsPending(true)),
        ajax
          .getJSON('some/get/clients/api')
          .map((clients: IClient[]) => {
            return fetchClientsSuccess(
              map(clients, (client, index) => ({
                key: index,
                ...client,
              })),
            );
          })
      );
    });

那就是说，我建议不要同步调度另一个动作来设置抓取正在等待的状态，而是依靠原始fetchClients动作本身来获得相同的效果。你的减速器应该假设，如果看到这样一个动作，那么无论如何仍然会开始取出。这样可以节省样板并有助于微观穿孔，因为您不需要经历减速器，史诗和重新渲染两次。

虽然没有规则，所以如果你对此有强烈的感觉，那就去吧:)。

redux-observable派遣行动

1 个答案: