再谈Redux

先分享一个有趣的现象。或许是小厂的缘故，经常会在一些项目中看到vuex的身影，憋屈的是它经常会被用来存用户相关的数据，并且是只存当前登陆用户的相关信息，或者再存些权限、菜单数据。经手过的项目中用到状态管理的地方其实并不多，所以很多时候也没有太在意，毕竟用是挺好用的，但写起来还是不如组件状态那么简单。直到项目上用了React，并大范围使用redux后我对状态管理有了全新，确切的说是比较正确的认知。为了描述它，我专门画了张草图：




图上是一个令人痛苦的需求，点击“按钮2”点时候要将外层的“按钮1”设置为禁用状态。要求并不高，痛苦的地方在于他们间隔着好几层的嵌套（现实可能会更残酷些），如果通过事件传递，那么就涉及到所有隔着的组件调整，让它们帮忙传递这个事件。不难，但有点烦。当然，也可以换个思路，比如添加一个全局的事件管理程序，在“按钮1”所在的组件订阅一个事件，事件触发后禁用“按钮1”。当然还有很多类似的方式，如react context等。这个时候我们如果冷静的想想，控制按钮禁用的其实是一个属性，在组件中应该对应一个状态（比如：isDisable=true），如果“按钮2”点击后可以直接修改这个状态，好像会简单很多。这应该就是状态管理最基本的用法。为了方便理解，我还专门画了一张草图：




大概就这意思吧，状态管理就是将组件状态统一管理，方便组件间状态共享。状态管理是一个非常科学的设计，不仅能降低代码复杂度，还能降低组件的耦合程度。在复杂的场景下，结合中间件可以轻易的解决很多令人头疼的需求，高效、简洁，当然最重要的还是优雅！