我正在使用 setInterval 來增加計數并將其顯示在如下所示的 div 上。我確信增量計數運行良好。不知道我在做什么錯誤。
function DivClicker() {
const [count, setCount] = React.useState<number>(0);
function incrementCount():void{
setCount((prev)=>prev 1);
}
setInterval(incrementCount,1000);
return (
<div>
<div className='middle-div'>
<div>{count}</div>
</div>
</div>
)
}
export default DivClicker;
它在幾秒鐘內變得瘋狂并大幅增加。請指導。大多數情況下，它處于無限回圈中。我不知道為什么。
uj5u.com熱心網友回復：
您不僅要設定每次渲染的狀態 - 導致無限回圈，而且還要添加一個新的間隔來設定每次渲染的狀態。所以每次你添加越來越多的無限 setStates。
通過在 a 中僅設定一次間隔來解決此問題useEffect：
function DivClicker() {
const [count, setCount] = React.useState<number>(0);
function incrementCount():void{
setCount((prev)=>prev 1);
}
useEffect(() => {
const interval = setInterval(incrementCount,1000);
return () => clearInterval(interval);
}, []);
return (
<div>
<div className='middle-div'>
<div>{count}</div>
</div>
</div>
)
}
export default DivClicker;
如果您收到有關缺少依賴項的 es-lint 警告，您可以incrementCount進入useEffect.
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/432123.html
標籤：javascript 反应 使用状态