我们可以将 redux-batch-middleware 与 redux-observable 一起使用吗？

Question

const fetchListEpic = (action$, store) =>
  action$.ofType('LOAD_LIST')
    .switchMap(() =>
      concat$(
        of$(openLoader()),
        fromPromise$(fetchListFromServer())
          .flatMap(list => of$(loadListSucceeded(list), closeLoader()))
          .catch(e =>
            of$(
              openSnackbar('ERROR'),
              closeLoader(),
            ),
        ),
     )
  );

这里 loadListSucceeded 和 closeLoader 动作将被一一调度，这将导致组件的多次重新渲染。

是否也可以使用 redus-observable 批量处理多个操作？

---

更新：

我们可以使用https://github.com/mrydengren/redux-batch-middleware吗？ redux-batch-middleware 需要一系列操作，但 redux-observable 仅适用于对象。

Answer 1

redux-batched-actions 与 redux-observable 配合得很好。这是一个演示，您可以在控制台中看到它只重新渲染一次，尽管顺序存在PONG 和SECOND_PONG：

https://jsbin.com/kewomex/edit?js,console,output

---

根据您的编辑和 cmets 进行编辑：

我们可以使用https://github.com/mrydengren/redux-batch-middleware吗？ redux-batch-middleware 需要一系列动作，但 redux-observable 仅适用于对象。

是的！事实上，你可以使用 [几乎] 任何带有 redux-observable 的中间件。 redux-observable 本身对你的史诗发送的东西一无所知。它只是：

rootEpic(action$, store).subscribe(store.dispatch)

有了这些知识，您接下来需要注意中间件的应用顺序是从左到右提供给applyMiddleware。您可以将其视为store.dispatch 将分派的任何内容传递给第一个中间件，然后选择做某事和/或然后将该动作传递给下一个中间件，等等。

因此，虽然 redux-observable 本身并不关心动作是什么样的，但您的史诗可能会这样做。例如ofType 运营商可以。这可能不会导致任何问题，因为如果调度的“动作”实际上是一组动作，action.type 将只是undefined 并被ofType 过滤掉而不会出现错误。无论如何，将 redux-batch-middleware 放在 redux-observable 之前可能是个好主意，这样数组就会被消耗掉，并且每个内部动作都会在返回给你的史诗之前发出。这也意味着这些动作中的每一个也可以由其他史诗处理，这太棒了。

https://jsbin.com/yemixet/edit?js,console,output

import { batch, batching } from 'redux-batch-middleware';

const store = createStore(batching(rootReducer),
  applyMiddleware(batch, epicMiddleware)
);