Me gustaría saber cómo puedo obtener la API la primera vez que vuelva a cargar la página y luego llamar a la API nuevamente una vez por hora para actualizar mi interfaz de usuario porque esa API se actualiza una vez por hora de manera predeterminada.
aquí está mi código
const [news, setNews] = useState([]) useEffect(() => { setInterval(() => { (async () => { tryÏ { const res = await fetch(`https://newsapi.org/v2/top-headlines?country=""""&apiKey=""""""""`) const data = await res.json() setNews(data) console.log("yes") } catch (error) { console.log(error) } })() }, 36000000); }, [])con ese código no puedo obtener resultados en la recarga de la página por primera vez, solo después de una hora ...
Mueva su llamada API a una función separada. Llámelo en la carga de la página y en el tiempo de espera:
let callApi = async () => { try { const res = await fetch(url) const data = await res.json() setNews(data) } catch (error) { console.log(error) } }; useEffect(() => { callApi(); setInterval(callApi, 1000 * 60 * 60) });Puede crear otra función y llamar desde el intervalo y fuera de ambos.
const [news, setNews] = useState([]); useEffect(() => { const fetchData = async () => { try { const res = await fetch( `https://newsapi.org/v2/top-headlines?country=""""&apiKey=""""""""` ); const data = await res.json(); setNews(data); console.log("yes"); } catch (error) { console.log(error); } }; fetchData(); const interval = setInterval(() => { fetchData(); }, 36000000); return () => clearInterval(interval); }, []);Puedes probar este código:
const [news, setNews] = useState([]); const [timer, setTimer] = useState(null); const APIResponse = async (url) => { try { const response = await fetch(url); const data = await response.json(); setNews(data); } catch (e) { console.error(e); } }; useEffect(() => { APIResponse("https://newsapi.org/v2/top-headlines?country=""""&apiKey="""""""""); setTimer( setInterval(async () => { APIResponse("https://newsapi.org/v2/top-headlines?country=""""&apiKey="""""""""); }, 5000) ); return () => clearInterval(timer); }, []);