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
.
如果你想使用多个增强子,比如applyMiddleware
和devTools
,你需要使用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(应用中间件(...中间件)),
);
我以前有过这样的经历:
createStore(reducers, {}, applyMiddleware(reduxThunk));
刚刚在某处看到了一段不同的代码,现在将我的代码更改为此,使用 compose
:
createStore(reducers, {}, compose(applyMiddleware(reduxThunk)))
目前两者都运行良好。但是我不完全理解其中的区别。是我之前的错误吗?有人可以给我解释一下吗?
来自 redux 文档:
提示 所有 compose 所做的就是让您编写深度嵌套的函数转换,而无需代码向右漂移。不要给它太多的信任!
您还可以添加一些不同于 thunk 和中间件的增强功能。看看这个
“store enhancer”是一种特定类型的 Redux 插件,它环绕商店以赋予它额外的能力。
createStore
接受单个商店增强器作为参数,并使用它来自定义创建的商店。
这意味着如果您想同时使用 多个 商店增强器,您需要一种方法以某种方式将它们组合成一个商店增强器,以便您可以将其传递给 createStore
.
applyMiddleware
是一个存储增强器,因此您可以直接使用它并将其结果作为 one-and-only 增强器传递给 createStore
.
如果你想使用多个增强子,比如applyMiddleware
和devTools
,你需要使用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(应用中间件(...中间件)), );