我目前对使用 Flux 提出的 hack 不满意,现在使用 Redux 在我的商店中填充 initialState。
我总是在初始页面加载时发送 JSON 的有效负载。在我的某些应用程序中,通用 JavaScript 不是一个选项,因为它们并非都由 Node.js 支持。我想重点关注有关如何将数据预加载到客户端的“最佳实践”和模式。然后,我觉得转移到服务器是微不足道的。
以下是我目前在工作中和其他一些使用 Redux 的玩具应用程序中所做的事情的要点:
https://gist.github.com/kevinold/5767bb334472b7e2bfe3
总结一下:
- 我正在随页面向下发送全局变量
- 在 componentDidMount() 中,我正在分派“接收”和处理各种数据的操作。(这些“接收”方法用于在通过请求操作异步获取这些数据位时处理这些数据位,我在这里重新利用它们,因为我已经有了这些数据。)
这有效,我们没有遇到任何问题,但感觉就像我不太满意的黑客。另外,我觉得 Redux 的初始状态对我这样做并不满意。
根据http://rackt.org/redux/docs/recipes/ServerRendering.html和“客户端”部分,我可以将 initialState 传递给我的商店。
这是我正在帮助的另一个项目(KeystoneJS)的补丁。我将它的 Keystone 对象传递到 initialState 中:
虽然这不工作,你可以看到,我不得不与我的整体combinedReducers输出的形状(https://github.com/kevinold/keystone/commit/6f80c2f6f1e5c081361369a8bb31b75f1e62460f#diff-b4b498ca92c4d05e050b45c725c26f9d),或者我会得到控制台警告等。
我可能在处理这个问题时非常懒惰,但是在添加/更改与减速器相关的任何内容(添加减速器,它们的组成方式等)时,我试图限制必须更新另一条数据。
我意识到我可能必须这样做才能将这个初始状态正确地放入减速器中。
我目前正在消化(https://github.com/erikras/react-redux-universal-hot-example/blob/master/src/client.js#L25)如何处理它的初始状态。
我真的很感激一些关于对其他人有用的“最佳”和“现实世界”实践的反馈。