亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

setInterval 無限制重新渲染反應(yīng)完整元件。為什麼會發(fā)生這種情況以及如何解決?
P粉978742405
P粉978742405 2024-04-03 15:39:05
0
1
695

這是我的反應(yīng)程式碼。它使元件無限重新渲染:

const [seconds, setSeconds] = useState(60)
useEffect(() => {
    const interval = setInterval(() => {
        setSeconds(seconds => seconds - 1);
    }, 1000);
    return () => clearInterval(interval);
}, []);

console.log("object");

P粉978742405
P粉978742405

全部回覆(1)
P粉476046165

發(fā)生這種情況是因為您僅在元件卸載時清除間隔,這僅在使用者離開頁面時才會發(fā)生。

也許這就是您所需要的?當(dāng)間隔達(dá)到 0 時,我將清除它。但為此我必須使用引用,我不能使用 setInterval 中的狀態(tài),因為它只有初始值:

export default function App() {
  const [seconds, setSeconds] = useState(5);
  const secondsRef = useRef(seconds);

  useEffect(() => {
    const interval = setInterval(() => {
      if (secondsRef.current  seconds - 1);
    }, 1000);
    return () => clearInterval(interval);
  }, []);

  console.log("running", new Date());

  return 

{seconds ; }

最新下載
更多>
網(wǎng)站特效
網(wǎng)站源碼
網(wǎng)站素材
前端模板