假设我有一个简单的切换:
当我点击按钮时，颜色组件在红色和蓝色之间变化
我可能会通过做这样的事情来实现这个结果。
索引.js
Button: onClick={()=>{dispatch(changeColor())}}
Color: this.props.color ? blue : red
容器.js
connect(mapStateToProps)(indexPage)
action_creator.js
function changeColor(){
return {type: 'CHANGE_COLOR'}
}
reducer.js
switch(){
case 'CHANGE_COLOR':
return {color: true}
但要编写一些我本可以在 5 秒内使用 jQuery、一些类和一些 css 实现的代码……
所以我想我真正想问的是，我在这里做错了什么？
最佳答案
Redux 主要用于“应用程序状态”。也就是说，与您的应用程序逻辑相关的任何内容。建立在它之上的 View 是该状态的反射(reflect)，但不必为它所做的一切专门使用该状态容器。
只需问这些问题:这个状态对应用程序的其余部分重要吗？应用程序的其他部分是否会根据该状态表现不同？在许多轻微的情况下，情况并非如此。以下拉菜单为例:它打开或关闭的事实可能不会对应用程序的其他部分产生影响。因此，将其连接到您的商店可能有点矫枉过正。这当然是一个有效的选择，但并不能真正为您带来任何好处。您最好使用 this.state 并结束它。
在您的特定示例中，切换按钮的颜色是否会对应用程序的其他部分产生影响？如果它是应用程序主要部分的某种全局开/关切换，它绝对属于商店。但是，如果您只是在单击按钮时切换按钮颜色，则可以保留本地定义的颜色状态。单击按钮的 Action 可能会产生其他需要 Action 分派(dispatch)的效果，但这与它应该是什么颜色的简单问题是分开的。
一般来说，尽量让你的应用状态尽可能的小。您不必将所有内容都塞进去。必要时做，或者把东西放在那里很有意义。或者在使用开发工具时是否让您的生活更轻松。但不要过分强调它的重要性。
关于javascript - react -Redux : Should all component states be kept in Redux Store，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35328056/