我正在使用React/Redux构建一个应用程序,它在某些方面类似于文本编辑器.它不完全是文本编辑器,但它是相同的一般范例.有一个用于放置新项目的光标.可以添加,选择,删除项目等.
我正在以最符合redux精神的方式努力构建我的减速器.我有单独的状态切片,表示选择状态,文本本身,光标状态和其他设置.我认为"redux"方法是为每个状态切片设置减速器,独立地改变状态以响应动作.
但是,在文本编辑器中,这些状态切片比初看起来更加耦合.按键时,有时会在光标位置添加一个字母,光标将向前移动.但是,如果选择了文本,则将首先删除所选文本.如果您处于"插入"模式,右侧的文本将被"消耗".或者修改键可能已关闭,并且根本不添加文本.
换句话说,不同的状态切片非常耦合,并且在一个切片中发生的事情取决于其他状态切片的当前状态.
我已经阅读了Redux手册中的"Beyond Combine Reducers"部分并知道如何在切片减速器之间共享状态,但如果最终结果是将整个状态传递给每个切片减速器,这似乎是不优雅的.我不喜欢他的方法的另一个方面是每个减速器必须查看整体状态,并独立地得出关于它对特定动作的正确响应应该是什么的相同结论.这就是我应该做的事情,或者我应该以某种方式构建我的状态?
一个集中式缩减器的替代方案告诉光标,选择状态,内容等如何变异在概念上更容易,但似乎不能很好地扩展.
我还读到,很多时候耦合状态表明你的状态不是最小的,你应该重组并使用memoized选择器.然而,这似乎并非如此.光标的位置不能从文本中导出,也不是选择状态.
最后,我还考虑过Thunk中间件,因为这是我见过的用于处理多个/更复杂动作的建议.我犹豫不决,因为它似乎更适合异步调度,而这不是那个.
我想了解设计这种类型应用程序的正确方法,这种方法最符合"redux"设计模式,并了解如果有多种方法可能会有任何权衡.
我写了"Structuring Reducers"文档部分,很高兴看到人们至少阅读它并发现它很有用:)
你是对的,Redux reducer逻辑的惯用方法是小的reducer函数,由状态片组织,独立响应相同的动作.然而,这不是一个固定的要求,并且有时候将一些逻辑合并到一个地方更有意义.
如果没有看到你的状态结构是什么以及确切地想要解决什么问题,给出绝对的具体建议有点困难,但总的来说,你应该随意以最有意义的方式构建你的状态和你的减速器逻辑.你的申请.如果在更集中的reducer函数中更好地使用某些逻辑,一次更新几个嵌套的状态,那就去吧!
作为其他一些观察:
根据Redux FAQ关于"跨越Reducer共享状态"的问题,一种方法是将更多信息放入调度的操作中.例如,{type : "KEYSTROKE", key : "A"}您可以派遣,而不是调度{type : "KEYSTROKE", key : "A", cursorPos : 12345, ctrl : true, alt : false}.
此外,虽然thunks是基本异步逻辑的好地方,但它们也可用于复杂的同步逻辑,包括检查当前的应用程序状态.我有一个要点,演示了一些常见的thunk用例.
Lemme抛出了一些可能对您有一般帮助的资源:
(作为一个方面说明,我也目前正在博客中,将讨论什么实际的技术限制Redux的需要,为什么,VS你是如何"意"使用终极版,VS它是如何可能使用Redux的.带我一段时间来完成它,但如果你有兴趣,请留意我的博客.)
最后,如果您想进一步讨论事情,Discord上的Reactiflux聊天频道是一个闲逛,提问和学习的好地方.邀请链接位于https://www.reactiflux.com.请随意前往那里并提出问题 - 我通常在美国时间晚上在那里,但总会有很多人高兴地讨论事情.
| 归档时间: |
|
| 查看次数: |
399 次 |
| 最近记录: |