Por favor, comprenda que esta es la primera publicación.

Estoy desarrollando un tablero. Pero hay un problema.

Solía usar setInterval, pero escribí un código que realiza clearInterval cuando presiono el botón.

 import React, {useEffect, useRef} from 'react'; const testInterval = () => { const tick = useRef(null); useEffect(() => { tick.current = setInterval(() => console.log("mounted."), 1000); return () => { console.log("unmounted."); if(!tick.current) { //PopupActions.hide(); } else { clearRef(); } }; }, []); const clearRef = () => { clearInterval(tick.current); tick.current = null; } return ( <div> /* problem <button onClick={clearRef}>blahblah</button> */ </div> ); } export default testInterval;

cuando vuelvo rápidamente a la página original desde la página anterior y hago clic en el botón, la función clearInterval no funcionará de manera intermitente y continuará generando el registro "montado"

¿Por qué es esto un problema? ¿Y cómo podemos solucionar esto?