React-Redux：所有组件状态是否都应该保存在 Redux Store 中

假设我有一个简单的切换：

当我单击按钮时，颜色组件在红色和蓝色之间变化

我可能会通过做这样的事情来实现这个结果。

index.js

Button: onClick={()=>{dispatch(changeColor())}}
Color: this.props.color ? blue : red

容器.js

connect(mapStateToProps)(indexPage)

action_creator.js

function changeColor(){
 return {type: 'CHANGE_COLOR'}
}

减速器.js

switch(){
case 'CHANGE_COLOR':
return {color: true}

但这需要编写大量代码才能完成，而我可以使用 jQuery、一些类和一些 css 在 5 秒内实现这些目标......

所以我想我真正要问的是，我在这里做错了什么？

Redux 主要用于“应用程序状态”。也就是说，与您的应用程序逻辑相关的任何内容。构建在其之上的视图是该状态的反映，但不必专门使用该状态容器来完成它所做的一切。

只需问以下问题：此状态对于应用程序的其余部分重要吗？应用程序的其他部分会根据该状态表现不同吗？在许多小情况下，情况并非如此。以下拉菜单为例：它的打开或关闭可能不会对应用程序的其他部分产生影响。因此，将其连接到您的商店可能有点矫枉过正。这当然是一个有效的选择，但并不会真正给你带来任何好处。你最好使用this.state到此为止。

在您的特定示例中，切换按钮的颜色是否会对应用程序的其他部分产生任何影响？如果它是应用程序主要部分的某种全局开/关切换，那么它绝对属于商店。但是，如果您只是在单击按钮时切换按钮颜色，则可以保留本地定义的颜色状态。单击按钮的操作可能会产生其他需要操作调度的效果，但这与按钮应该是什么颜色的简单问题是分开的。

一般来说，尝试使应用程序状态尽可能小。你不必推一切在那里。当你有必要的时候就这样做，或者把一些东西放在那里很有意义。或者，如果使用开发工具让您的生活更轻松。但不要过分夸大其重要性。