En el siguiente código:
useEffect(() => { const interval = setInterval(() => { setSeconds(seconds => seconds + 1); }, 1000); return () => clearInterval(interval); }, []); ¿Por qué necesita devolver una función de limpieza que restablece el objeto de intervalo? Según tengo entendido, dado que el objeto de la función de interval no se creó con useCallback() , la función debe reiniciarse con cada procesamiento y, por lo tanto, no tiene memoria de los valores de intervalo anteriores. ¿Por qué se necesita una función de limpieza para borrarlo antes del próximo renderizado?
¿Por qué se necesita una función de limpieza para borrarlo antes del próximo renderizado ?
(énfasis mío)
No es y no es lo que hace este código.
Al pasar una lista de dependencias vacía a useEffect ( [] ), le está diciendo a React que solo ejecute este enlace la primera vez que el componente se renderiza, no (!) cada vez que el componente se vuelve a renderizar.
Ahora, es necesario borrar el intervalo cuando el componente se desmonta/destruye (que es lo que hace este código); de lo contrario, el intervalo seguiría ejecutándose (y arrojaría un error eventualmente, ya que no puede actualizar el estado de un componente desmontado).