Redux:使用 compose() 或不使用它的 applyMiddleware 之间的区别?

Redux: Difference between using compose() or applyMiddleware without it?

我以前有过这样的经历:

  createStore(reducers, {}, applyMiddleware(reduxThunk));

刚刚在某处看到了一段不同的代码,现在将我的代码更改为此,使用 compose:

  createStore(reducers, {}, compose(applyMiddleware(reduxThunk)))

目前两者都运行良好。但是我不完全理解其中的区别。是我之前的错误吗?有人可以给我解释一下吗?

来自 redux 文档:

提示 所有 compose 所做的就是让您编写深度嵌套的函数转换,而无需代码向右漂移。不要给它太多的信任!

您还可以添加一些不同于 thunk 和中间件的增强功能。看看这个

“store enhancer”是一种特定类型的 Redux 插件,它环绕商店以赋予它额外的能力。

createStore 接受单个商店增强器作为参数,并使用它来自定义创建的商店。

这意味着如果您想同时使用 多个 商店增强器,您需要一种方法以某种方式将它们组合成一个商店增强器,以便您可以将其传递给 createStore.

applyMiddleware 是一个存储增强器,因此您可以直接使用它并将其结果作为 one-and-only 增强器传递给 createStore.

如果你想使用多个增强子,比如applyMiddlewaredevTools,你需要使用compose()将它们组合在一起.

请注意,您实际上应该使用 our official Redux Toolkit package, which has a configureStore API,它已经通过一行代码为您正确设置了 Redux 存储。

@markerikson 是对的。两者都很好。

  • 如果你正在开发简单的 React 应用程序,第一个就足够了。

  • 如果你处理大型项目,你需要使用第二个。如下所示:

    const history = createHistory(); const sagaMiddleware = createSagaMiddleware(); const routeMiddleware = routerMiddleware(历史); const middlewares = [thunk, sagaMiddleware, routeMiddleware];

    const composeEnhancers = (window['REDUX_DEVTOOLS_EXTENSION_COMPOSE'] 作为组合类型) ||撰写;

    const store = createStore( 结合减速器({ ...减速器, 路由器:connectRouter(历史), }), composeEnhancers(应用中间件(...中间件)), );