¿Por qué "hola" se registra en la consola cada segundo dos veces?
import { useEffect } from "react"; export default function App() { useEffect(() => { setInterval(() => console.log("hi"), 1000); }, []); return ( <div className="App"> Hello </div> ); }porque de eso se trata setInterval .
Desde MDN:
El método setInterval(), que se ofrece en las interfaces Window y Worker, llama repetidamente a una función o ejecuta un fragmento de código, con un retraso de tiempo fijo entre cada llamada.
Entonces, no desea usar setInterval porque ejecutará repetidamente su función, en su lugar use setTimeout
Además de lo que escribió @AngryJohn, también debe borrar el intervalo cuando el componente se desmonta, usando clearInterval así:
import { useEffect } from "react"; export default function App() { useEffect(() => { let interval = setInterval(() => console.log("hi"), 1000); return () => clearInterval(timer) // This "return" function executes when a component unmounts }, []); return ( <div className="App"> Hello </div> ); }Consulte esta pregunta SO para obtener más información.