用 React 编写应用程序时,通常用 Redux 做状态管理,以前一直不明白 Redux 为什么要对数据有那么多限制?今天看到《深入浅出 React 和 Redux》 终于明白了其中的缘由。
mvc
mvc 是非常普遍的一种架构模式。
view 是视图层,负责展示数据
control 是控制层,负责处理视图层的交互信息
model 是数据层,负责数据存储和处理。
对于网页来说就是,用户在网页上用键盘,鼠标等外设进行交互,网页针对用户交互做出相应的改变。其中网页上的内容是 view,交互要产生什么结果,这个业务逻辑是 model。响应交互事件,连接 view 和 model 的叫 control。
flux
mvc 的重要意义是用 control 把 view 和 model 分开,但在实际使用中,往往直接在 view 中使用 model, 这在项目复杂时会造成数据状态管理的混乱。
flux 做到了状态管理的的单向数据流。
flux 利用 action 充当 control,view 只需要触发 action 就能触发相应的数据处理逻辑改变数据,即用 control 改变 model。
flux 配合 react, 相当于是 mvc 架构。
redux
flux 虽然做到了单向数据流,但对数据的限制不够。后来的 redux 施加了下面 3 点限制,使得数据管理脉络清晰 。
- 单一数据源。
- 状态只读。
- 纯函数。
单一数据源,保证了数据的一致性,并且足够简单。
状态只读,且只能通过纯函数改变,保证了可预测性。