我目前不满意使用Flux进行的黑客攻击,现在Redux用于在我的商店中填充initialState.
我总是在初始页面加载的情况下发送JSON的有效负载.通用JavaScript在我的某些应用程序中不是一个选项,因为它们并非全部由Node支持.我想关注如何在客户端上预加载数据的"最佳实践"和模式.然后,我觉得搬到服务器是微不足道的.
以下是我目前在工作中使用Redux的一些其他玩具应用程序的要点:
https://gist.github.com/kevinold/5767bb334472b7e2bfe3
总结一下:
这是有效的,并没有我们遇到的任何问题,但它感觉像一个我不是很满意的黑客.另外,我觉得Redux的初始状态并不满意我这样做.
根据http://rackt.org/redux/docs/recipes/ServerRendering.html和"客户端"部分,我可以将initialState传递给我的商店.
这是我正在帮助的另一个项目(KeystoneJS)的补丁.我将它的Keystone对象传递给initialState:
虽然这确实有效,但正如你所看到的,我被迫匹配我的整体组合减速器的输出形状(https://github.com/kevinold/keystone/commit/6f80c2f6f1e5c081361369a8bb31b75f1e62460f#diff-b4b498ca92c4d05e050b45c725c26f9d)或者我会得到控制台警告等
我可能在处理这个问题时非常懒惰,但是当我添加/更改与reducers相关的任何内容时,我试图限制更新另一条数据(添加一个reducer,它们是如何编写的等等).
我意识到我可能必须正确地将这个initialState放入reducer.
我正在消化如何(https://github.com/erikras/react-redux-universal-hot-example/blob/master/src/client.js#L25)处理它的initialState.
我非常感谢有关为他人工作的"最佳"和"现实世界"实践的一些反馈.
Dan*_*mov 21
我不完全理解这个问题,但我会尽力回答.
在componentDidMount()中,我正在调度"接收"并处理各种数据的动作.(当通过请求操作获取异步时,这些"接收"方法在处理这些数据位时使用,我在这里重新利用它们,因为我已经拥有了数据.)
这是派遣他们的不好的地方.如果您选择直接调度操作而不是直接生成初始状态,请在渲染之前执行此操作.换句话说,在创建商店后立即这样做!这样您就不会呈现初始空白状态.
虽然这确实有效,但正如你所看到的,我被迫匹配我的整体组合减速器的输出形状(https://github.com/kevinold/keystone/commit/6f80c2f6f1e5c081361369a8bb31b75f1e62460f#diff-b4b498ca92c4d05e050b45c725c26f9d)或者我会得到控制台警告等
您不应该initialState手动创建对象.您应该在服务器上创建一个Redux存储,在dispatch那里执行操作以预先填充数据,当它准备就绪时,调用store.getState()以检索要传递给客户端的状态.在客户端上,您将从全局变量中读取它,并使用它创建客户端存储实例.换句话说,您永远不必手动创建 - 您initialState应该在服务器上抓取它store.getState(),将其传递给客户端,并使用它创建商店.
因此,我不明白你描述的问题.如果您的reducer名称或嵌套更改,它也将在服务器上更改.您无需做任何"修复" - 如果您在客户端和服务器上都使用Redux,它们的状态结构将匹配.
我非常感谢有关为他人工作的"最佳"和"现实世界"实践的一些反馈.
如果在服务器上使用Redux,请按上述方法预先填充商店,并将其状态传递给客户端.在这种情况下,您需要使用initialState参数createStore().
如果您出于某种原因不在服务器上使用Redux 但是您想要预先填充数据(例如,您可能使用Node之外的其他内容),那么调度操作的方法是您的下一个最佳选择,因为它不需要您的后端知道状态.在这种情况下,您应该将这些操作作为JSON传递给客户端,并在创建存储之后立即将dispatch()它们全部传递给客户端.
| 归档时间: |
|
| 查看次数: |
13246 次 |
| 最近记录: |