2016-05-17 61 views
14

我目前正在学习Redux,我已经或多或少地掌握了基本概念。我明白如何与行动和减员等一起工作。我正在努力的是理解如何正确设计状态树。我遇到了应该/不应该存储在应用程序状态中的细节,何时可以使用组件状态,处理状态更改的最佳方式等。设计REDX状态树

是否有任何好的教程或任何人都可以推荐博客来了解设计状态的最佳实践吗?

+3

我使用一个鸭子模式https://github.com/erikras/ducks-modular-redux,我保持每一个状态在减少。到目前为止,它一直在为我工作得很好,这样我就可以100%确定我的状态/错误来自何处。 – azium

回答

4

对此有很多不同的意见。这是我做的。

  1. 减速器 - 装东西,与我的数据模型(通常东西都在数据库中),需要进行保存和以后使用或跨组件

  2. LocalState(反应的setState)用来处理 - 在与用户输入和交互相关的单个组件中处理UI元素

所以,如果我是建模对这个问题的回应。终极版商店将有

store = { 
    session: { token: 'randomUid' } 
    user: { name: 'Austio' } 
    question: { id: 37288070 } 
} 

当我选择的文本框中输入数值来创建这个问题的答案是会handleInput从这个盒子,这将在answerText的的setState。

何时handleSubmit的形式,我会派遣出成功的东西像NEW_ANSWER与questionId和答案,以便我可以将它存储在商店使用,无论我需要它。

我最好的建议是开始编程的东西,很难找到你的偏好的边缘与使用redux /反应没有。

+1

“LocalState(react setState) - 在与用户输入和交互相关的单个组件中处理UI元素......”我也看到人们也采用这种方法,但是,我绝对认为该状态也很关键,而且我把它放在商店里。表单数据,突出显示的内容,鼠标状态等 - 全部!辩论我观察到的状态变成了一个滑坡。它可以导致困难,并减少了很多价值减少提供恕我直言。虽然这很容易! – cdaringe

+0

有趣的观点,最终做任何更自然的事情,对我来说,存储本地状态在全球范围内并不重要,这使得应用程序难以推理。我建议检查别人的想法。另外我的观点是来自8个开发人员在一个非常大的系统前端团队。这是一个很好的讨论https://github.com/reactjs/redux/issues/1287 – Austio

0

我会强烈建议在egghead.io https://egghead.io/courses/getting-started-with-redux

他带您构建一个简单的待办事项应用程序确认了丹·阿布拉莫夫的(终极版的作者)的教程,但真正强调整个最好的国家建设实践课程。