11、Redux 架构：原理、实现与应用

Redux 架构：原理、实现与应用

1. Redux 架构的起源与概念

Redux 架构的诞生源于 Facebook 桌面网页应用中的一个问题。当时，该应用在多个视图中同时显示 Messenger 未读消息数量，但各视图显示的数量不一致，导致数据不同步，应用看起来出现故障。为了保证数据一致性，一种新的单向架构 Flux 应运而生。后来，在 2015 年，Dan Abramov 和 Andrew Clark 基于 Flux 架构的灵感，创建了 Redux 作为 JavaScript 的实现。此后，也有了 Swift 和 Kotlin 等语言的 Redux 实现。

1.1 Redux 基本概念

• Store ：存储应用的所有状态，是应用的真相来源。所有视图从同一个 Store 获取数据，避免了不同视图显示不同数据的问题。
• Action ：描述状态变化的不可变数据。用户与界面交互时创建 Action，通过调度 Action 来改变 Store 中的状态。
• Reducer ：根据当前状态和 Action 来改变应用的状态。Reducer 是一个纯函数，不引入副作用，如不进行 API 调用或修改作用域之外的对象。

1.2 Store 的类型与特点

1.2.1 状态类型

• 视图状态 ：决定显示、隐藏、启用、禁用哪些用户元素，或是否显示加载动画。