React中Reusable State是什么？求准确定义及适用范围

一、核心定义 #

Reusable State指的是组件在卸载后重新挂载时能够被保留、复用的状态，是React 18为适配Offscreen API、React Refresh这类新特性提出的概念——这些场景下组件会经历「挂载→卸载→重新挂载」的循环，但状态不需要重置，而是要延续之前的状态。

二、属于Reusable State的类型 #

• 由useState创建的组件本地状态：比如const [count, setCount] = useState(0)里的count，组件卸载再挂载时，Strict Mode下会复用之前的状态值。
• 由useRef创建的引用状态：useRef存储的可变值（比如DOM引用、计时器ID）也属于可复用状态，卸载再挂载时不会被重置。
• 另外，useReducer创建的状态同样属于这类，本质和useState一致；但组件内部的临时变量（比如函数内声明的let temp = 0）不属于，因为每次挂载都会重新初始化。

三、和React 18 Strict Mode的关联 #

React 18 Strict Mode新增的「挂载→卸载→挂载」重复渲染行为，就是为了模拟组件需要复用状态的场景，帮开发者提前排查代码中不符合Reusable State要求的问题——比如useEffect里写了不可重复执行的清理逻辑，或者组件初始化时依赖了只能跑一次的副作用。

内容的提问来源于stack exchange，提问作者i like Cola