0
165
VistasReaccionar setInterval y useState
tengo 2 pregunta Primero, por qué este código no funciona. En segundo lugar, ¿por qué este código es lento cuando se trata de 2^n -1, por ejemplo, 1-3-7-15?
let time = 0 function App() { const [mytime, setMytime] = useState(time) setInterval(() => { time += 1 setMytime(time) }, 1000) return <div> {mytime} </div>
·
Juan Pablo Isaza
1 Respuestas
Responde la pregunta0
Tema
Se llama setInterval cada vez que mytime cambia para volver a renderizar (cuando llama a setMytime ). Y el número de llamadas a setInterval crece exponencialmente. Esto también conduciría a una pérdida de memoria.
Solución
Debes ejecutarlo solo una vez. Debe usar useEffect hook con una matriz de dependencia vacía.
Prueba así.
import { useEffect, useState } from "react"; function App() { const [mytime, setMytime] = useState(0); useEffect(() => { // create a interval and get the id const myInterval = setInterval(() => { setMytime((prevTime) => prevTime + 1); }, 1000); // clear out the interval using the id when unmounting the component return () => clearInterval(myInterval); }, []); return <div> {mytime} </div>; } export default App; 
·
Juan Pablo Isaza
Denunciar
Responde la pregunta