我打算迁移到Redux。
我的应用程序由很多部分(页面,组件)组成,所以我想创建很多reducer。Redux示例显示我应该使用combineReducers()
来生成一个reducer。
另外,据我所知,Redux应用程序应该有一个存储,它是在应用程序启动后创建的。当创建存储时,我应该传递我的组合reducer。如果应用程序不是太大,这是有意义的。
但是如果我构建了多个JavaScript包呢?例如,应用程序的每个页面都有自己的包。我认为在这种情况下,一个组合的reducer是不好的。我看了Redux的源代码,我发现了replaceReducer()
函数。这似乎是我想要的。
我可以为我的应用程序的每个部分创建组合的reducer,并在应用程序的各个部分之间移动时使用replaceReducer()
。
这是一个好办法吗?
7条答案
按热度按时间8qgya5xd1#
更新:另请参阅how Twitter does it。
这不是一个完整的答案,但应该可以帮助你开始。请注意,我不是丢弃旧的reducer-我只是在组合列表中添加新的reducer。我认为没有理由丢弃旧的reducer--即使在最大的应用程序中,你也不太可能拥有数千个动态模块,这正是你 * 可能 * 想要在应用程序中断开一些reducer的地方。
还原器. js
商店. js
路径. js
也许有更简洁的表达方式--我只是展示一下这个想法。
ia2d9nvy2#
这是我如何在当前的应用程序中实现它的(基于GitHub问题中Dan的代码!)
在引导应用时创建注册表示例,传入将包含在条目包中的reducer:
然后,在配置存储和路由时,使用一个函数,您可以将reducer注册表指定给:
其中这些函数看起来类似于:
以下是使用此设置创建的基本实时示例及其源代码:
它还包括为您的所有减速器启用热重装所需的配置。
abithluo3#
现在有一个模块可以向redux存储中添加注入的reducer,这个模块叫做Redux Injector。
以下是如何使用它:
1.不要合并reducer,而是像平常一样把它们放在一个(嵌套的)函数对象中,但不要组合它们。
1.使用redux注入器的createInjectStore,而不是redux的createStore。
1.用注射异径管注射新的异径管。
下面是一个示例:
完全披露:我是模块的创建者。
v9tzhpje4#
截至2017年10月:
实现Dan的建议,仅此而已,不涉及您的商店、项目或习惯
也有其他的库,但是它们可能有太多的依赖项,较少的例子,复杂的用法,与一些中间件不兼容,或者需要你重写你的状态管理。
m1m5dgzv5#
我们发布了一个新的库,它可以帮助调整Redux应用程序,并允许动态添加/删除Reducer和中间件。
请看一下https://github.com/Microsoft/redux-dynamic-modules
模块提供以下优点:
功能
示例方案
zf9nrax16#
这是另一个关于代码拆分和redux存储的例子,在我看来非常简单和优雅。我认为它可能对那些正在寻找工作解决方案的人非常有用。
这个存储器有点简化了,它不强制你在你的状态对象中有一个命名空间(reducer.name),当然可能会有名称冲突,但是你可以通过为你的reducer创建一个命名约定来控制这一点,这应该是好的。
cig3rfwq7#
以下是我所遵循的方法来实现这一点。我们有我们的存储文件,其中我们将有静态减速器谁将始终存在于减速器,并将动态减速器将添加时,所需的组件安装。
减速器文件
将始终存在于应用程序中的staticReducer
存储文件
在这里,我们可以有我们的定制中间件,记录器等,这些我们可以在中间件数组中传递。并使用如下。
现在,假设我们有一个组件,我们希望动态加载,并且该组件可能有自己的切片(reducer),那么我们可以调用inject reducer来动态地将其添加到现有的reducer中。
安装此组件后,我们将发现实体2注入到我们的存储中。