React-Redux:是否应该将所有组件状态都保存在 Redux Store 中 [英] React-Redux: Should all component states be kept in Redux Store
问题描述
假设我有一个简单的切换:
Say I have a simple toggle:
当我点击按钮时，颜色组件在红色和蓝色之间变化
When I click the button, the Color component changes between red and blue
我可能会通过做这样的事情来达到这个结果.
I might achieve this result by doing something like this.
index.js
Button: onClick={()=>{dispatch(changeColor())}}
Color: this.props.color ? blue : red
容器.js
connect(mapStateToProps)(indexPage)
action_creator.js
action_creator.js
function changeColor(){
return {type: 'CHANGE_COLOR'}
}
reducer.js
switch(){
case 'CHANGE_COLOR':
return {color: true}
但是对于我可以在 5 秒内使用 jQuery、一些类和一些 css 实现的东西，要编写大量代码......
but this is a hell of a lot of code to write for something that I could have achieved in 5 seconds with jQuery, some classes, and some css...
所以我想我真正要问的是，我在这里做错了什么?
So I guess what I'm really asking is, what am I doing wrong here?
推荐答案
Redux 主要用于应用程序状态".也就是说，任何与您的应用程序逻辑相关的东西.建立在它之上的视图是该状态的反映，但不必专门使用该状态容器来完成它所做的一切.
Redux is primarily intended for "application state." That is, anything related to your application logic. The view built on top of it is a reflection of that state, but does not have to exclusively use that state container for everything it does.
简单地问这些问题:这个状态对应用程序的其余部分重要吗?应用程序的其他部分是否会根据该状态表现不同?在许多小情况下，情况并非如此.拿一个下拉菜单:它打开或关闭的事实可能不会对应用程序的其他部分产生影响.因此，将其连接到您的商店可能有点矫枉过正.这当然是一个有效的选择，但并没有真正为您带来任何好处.您最好使用 this.state 并收工.
Simply ask these questions: Is this state important to the rest of the application? Will other parts of the application behave differently based on that state? In many minor cases, that will not be the case. Take a drop down menu: The fact that it's open or closed probably won't have an effect on other parts of the app. So, wiring it up to your store is probably overkill. It's certainly a valid option, but doesn't really net you any benefits. You're better off using this.state and calling it a day.
在您的特定示例中，切换按钮的颜色是否会对应用程序的其他部分产生任何影响?如果它是应用程序主要部分的某种全局开/关切换，那么它绝对属于商店.但是，如果您只是在单击按钮时切换按钮颜色，则可以保留本地定义的颜色状态.点击按钮的动作可能有其他需要动作分派的效果，但这与它应该是什么颜色的简单问题是分开的.
In your particular example, does the color that button is toggled to make any difference in other parts of the application? If it's some sort of global on/off toggle for a major part of your application, it definitely belongs in the store. But if you're just toggling a button color when you click the button, you can leave the color state locally-defined. The action of clicking the button might have other effects that require an action dispatch, but that is separate from the simple question of what color it should be.
一般来说，尽量让你的应用程序状态尽可能小.你不必把所有东西都塞进去.在必要时这样做，或者在那里保留一些东西很有意义.或者，如果使用开发工具让您的生活更轻松.但不要过分强调它的重要性.
In general, try to keep your application state as small as possible. You don't have to shove everything in there. Do it when you have to or it makes a lot of sense to keep something there. Or if it makes your life easier when using Dev Tools. But don't overload its importance too much.
这篇关于React-Redux:是否应该将所有组件状态都保存在 Redux Store 中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
