0

Mi problema es que estoy haciendo una práctica en react, estoy usando useState y un setInterval para poder ver cómo es el funcionamiento del estado. Pero al momento de hacer que la variable del useState cambie para así poder mostrarlo en pantalla, se muestra un reconteo.

**import { useState } from "react";

function Estado() {
  const [intervalo, setIntervalo] = useState(0);

  setInterval(() => {
    setInt(int + 1)
  }, 400);

  return <h1>{intervalo}</h1>;
}

export default Estado;**

1 respuesta 1

1

En react no puedes dejar el setInterval dentro del componente, ya que cuando se ejecute, estás renderizando de nuevo todo el componente y incluso el setInterval, es decir, reseteándolo.

Para usar setInterval dentro de un componente, Usalo dentro de un useEffect Y forza el rerender con un clearInterval, de esta forma

import { useState, useEffect } from "react";

function Estado() {
  const [intervalo, setIntervalo] = useState(0);

  useEffect(() => {
      const interval = setInterval(() => {
         setIntervalo(prevIntervalo => prevIntervalo + 1);
      }, 600);
      return () => clearInterval(interval);
  }, [])

  return <h1>{intervalo}</h1>;
}

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.