企业🤖AI Agent构建引擎,智能编排和调试,一键部署,支持私有化部署方案 广告
# Redux简介 :-: ![](http://xiaoyulive.oss-cn-beijing.aliyuncs.com/imgs/react/redux.png?x-oss-process=style/thumb) Redux 是 JavaScript 状态容器,提供可预测化的状态管理。 2013年问世的Flux饱受争议,而2015年DanAbramov提出了在Flux基础上的改进框架Redux,则是一鸣惊人,在所有Flux的变体中算是最受关注的框架,没有之一。 Redux可以让你构建一致化的应用,运行于不同的环境(客户端、服务器、原生应用),并且易于测试。不仅于此,它还提供超爽的开发体验。 Redux 除了和 React 一起用外,还支持其它界面库。它体小精悍(只有2kB)且没有任何依赖。 ## Redux 的 基本原则 Flux 的基本原则是“单向数据流”, Redux 在此基础上强调三个基本原则: - 唯一数据源( Single Source of Truth); > 整个应用的 state 被储存在一棵 object tree 中,并且这个 object tree 只存在于唯一一个 store 中。 --- - 保持状态只读( State is read- only); > 保持状态只读,就是说不能去直接修改状态,要修改Store的状态,必须要通过派发一个action对象完成,这一点,和Flux的要求并没有什么区别。 --- - 数据改变只能通过纯函数完成( Changes are made with pure functions)。 > 这里所说的纯函数就是Reducer,Redux这个名字的前三个字母Red代表的就是Reducer。按照创作者DanAbramov的说法,Redux名字的含义是Reducer+Flux。 > Reducer不是一个Redux特定的术语,而是一个计算机科学中的通用概念,很多语言和框架都有对Reducer函数的支持。就以JavaScript为例,数组类型就有reduce函数,接受的参数就是一个reducer,reduce做的事情就是把数组所有元素依次做“规约”,对每个元素都调用一次参数reducer,通过reducer函数完成规约所有元素的功能。 --- ## Redux 的设计思想 (1)Web 应用是一个状态机,视图与状态是一一对应的。 (2)所有的状态,保存在一个对象里面。 ## 来自 Redux 的声明 需要强调一下:Redux 和 React 之间没有关系。Redux 支持 React、Angular、Ember、jQuery 甚至纯 JavaScript。 尽管如此,Redux 还是和 React 和 Deku 这类框架搭配起来用最好,因为这类框架允许你以 state 函数的形式来描述界面,Redux 通过 action 的形式来发起 state 变化。 # 什么时候需要用到 Redux 1. 用户的使用方式复杂 2. 不同身份的用户有不同的使用方式(比如普通用户和管理员) 3. 多个用户之间可以协作 4. 与服务器大量交互,或者使用了WebSocket 5. View要从多个来源获取数据 6. 某个组件的状态,需要共享 7. 某个状态需要在任何地方都可以拿到 8. 一个组件需要改变全局状态 9. 一个组件需要改变另一个组件的状态 # 什么时候不需要使用 Redux 如果你不知道是否需要 Redux,那就是不需要它。只有遇到 React 实在解决不了的问题,你才需要 Redux 。 以下情况不需要使用到 Redux,否则倒容易增加代码的复杂性。 1. 用户的使用方式非常简单 2. 用户之间没有协作 3. 不需要与服务器大量交互,也没有使用 WebSocket 4. 视图层(View)只从单一来源获取数据