什么是状态管理
状态管理是 在 React 中构建可扩展和可维护应用程序的最关键方面之一。它指的是存储、管理和更新驱动 React 应用程序行为和呈现的数据的过程。
状态管理工具的本质：管理共享内存中的状态
单页应用的各个组件本身是共享内存的，如果将状态保存在内存中，就可以读写统一内存中的变量，从而达到状态共享的目的。
React有很多状态管理工具的原因
跟不同前端框架的定义有关，Vue和Angular双向数据绑定，计算属性等，数据是响应式的，控制视图刷新，拥有计算属性等，这些使得Vue和Angular需要状态管理的场景减少，此外其本身就包含了完整的状态管理工具，比如Vue的Vuex和Pinia、Angular的Service（RXjs）等，从官方定调。而React不一样，React是一个纯UI层的前端框架，UI=fn（state），React将状态的变动完全交给开发者。
React状态管理工具
- React自带：Local State（props）和Context
- 单向数据流：Flux、Redux（Redux-toolkit）
- 双向数据绑定：Mobx
- 原子型状态管理：Recoil、Jotai
- 异步操作密集型：Rxjs
每一种状态管理工具都有其不同的适用性，不同场景下需要合理的选择状态管理工具。
React状态管理
子页面和子页面之间的通信，React本身提供了Context。
React中的Context解决了react中，props或者state进行多级数据传递，则数据需要自顶下流经过每一级组件，无法跨级的问题。但是Context在页面间共享数据的时候同样有很多问题：
- Context相当于全局变量，难以追溯数据的变更情况
- 使用Context的组件内部耦合度太高，不利于组件的复用和单元测试
- 会产生不必要的更新（比如会穿透memo和dependicies等）
- Context只能存储单一值，无法存储多个各自拥有消费者的值的集合
- 粒度也不太好控制，不能细粒度的区分组件依赖了哪一个Context
- 多个Context会存在层层嵌套的问题
属性和状态
属性是只读的，状态是可变的。
Props 和 state 是 React 中的两个基本概念，React 是一个流行的用于构建用户界面的 JavaScript 库。这些概念用于管理 React 中组件的数据和行为。Props 是属性的缩写，是从父组件传递到子组件的数据。它们是只读的，用于自定义组件的外观和行为。Props 在其 JSX 语法中作为参数传递给组件，并且可以在组件内使用props目的。例如，一个组件可以接收一个名为“title”的道具并将其呈现为页面上的标题。
另一方面，状态是一种管理组件的本地数据的方法，该数据可以随时间变化。与 props 不同，state 是可变的，并且可以根据用户交互或其他事件由组件本身更新。应该谨慎谨慎地使用状态，因为如果管理不当，它会导致组件重新渲染并影响性能。
