使用 `useEffect` 监听状态的改变。
一、异步特性
在批量处理状态更新时,用以提高性能。
二、异步解决
使用`useEffect`来处理更新后的状态,`useEffect`钩子在组件渲染后执行,并且会在依赖项(第二个参数)发生变化时重新执行。可以利用这个特性来处理`useState`更新后的状态。
javascript
import { useState, useEffect } from "react";
function MyComponent() {
const [count, setCount] = useState(0);
const handleClick = () => {
setCount(count + 1);
setCount(count + 2);
};
useEffect(() => {
console.log("Count has been updated:", count);
}, [count]);
return (
<div>
<p>Count: {count}</p>
<button onClick={handleClick}>Increment</button>
</div>
);
}