Context
Context通过把用户信息存储在一个地方,需要的组件只需要调用他即可。
可以把Context看做一个存储东西的组件,它包括了其他组件可能想访问的共享信息
无论何时Context中的值更新,所有使用Context值(也可以说监听)的组件都会重新渲染(re-render)。
Redux
一种第三方状态管理模式or库 要理解redux,首先了解一下Reducer。
Reducer是一种状态管理模式(pattern for state management),我们甚至可以在react context中使用它。
reducer结构:
Reducer存储的是一个对象。
Reducer使用Action更改状态(而不是useState和useEffect)。 Action包括两个字段,type是必填字段,payload是可选的。
reducer使用场景:
当一个操作需要同时修改多个state值的时候,适合用reducer,会有一个逻辑的整合。
Redux和Context的区别
主要是两方面:
- 可访问性(accessibility)
- 数据流(flow of data)
- 可访问性: Context仅把需要访问它的组件包裹起来;而Redux把整个应用程序包裹起来(被称为全局状态管理),因为Redux存储了应用程序的所有状态。 数据流
- 数据流
Context with Reducer数据流如下:
注意:每一个useReducer Hook都会有一个dispatch
Redux数据流如下:
注意:只有一个dispatch,所有的Reducer被整合成一个Root Reducer