redux
what’s redux
redux 中文文档 中的几个关键特性:
1. 状态容器,提供可预测化的状态管理
2. 跨平台,客户端、服务端、原生应用都能用
3. 易于测试
4. 轻量,支持 react 等界面库
其中第一点,讲明了 redux 的主要用途:状态容器
以 react 为例,页面是渲染状态树得到,有静态状态(props)、动态状态(state)。通过在代码中 setState 来修改状态树,状态自上而下传递到各个子组件,最终触发组件树的重新渲染。
使用 redux,我们就将状态的定义和允许的迁移 function 挪出去,放到一个状态容器里,来有效管理组件的所有状态和状态迁移。此时 component 代码中就没有 state、setState 等定义了。
counter without redux
以计数器为例,不使用 redux,即直接在本地定义 state,并通过 setState 修改状态,以实现重现渲染。(源代码)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
import React, {Component} from 'react';
export default class Counter extends Componen