react 记录 useState 2次状态
时间: 2024-09-15 12:04:25 浏览: 41
使用代理跟踪状态使用情况。 优化 useState/useReducer、React Redux、Zustand 等的重新渲染。
React 的 `useState` Hook 允许你在组件内部维护状态。当你调用 `useState` 并传入一个初始值时,它将返回一个数组,第一个元素是你当前的状态,第二个元素是一个用来更新状态的 setter 函数。
如果你想记录状态变化的两次实例,你可以这样做:
```jsx
const [state, setState] = useState(initialValue);
// 记录状态第一次变更
const initialStateChange = state;
// 更新状态
setState(newState);
// 在适当的地方,如 componentDidUpdate 或者 useEffect 清洁阶段,获取第二次状态
useEffect(() => {
const nextStateChange = state; // 这里获取到的状态是更新后的状态
console.log('第二次状态:', nextStateChange);
}, [state]); // 注意这里,我们需要监听 state 变化
```
通过这种方式,你可以分别获取状态的初始值和更新后的值。不过通常情况下,我们关心的是状态的变化过程而不是单一的具体状态值,除非有特殊需求。
阅读全文