Intenté obtener datos de una API giphy usando la siguiente función e imprimí el valor devuelto en la consola del navegador.
const fetchData = (url) => { return axios.get(url).then(res => res.data.data); } const data = fetchData(giphy_url); console.log(`Data: ${data}`); Pero al imprimir el valor de la variable de data , imprime:
Data: [object Promise]Quiero que se acceda a los datos de la respuesta. ¿Hay algo que me estoy perdiendo?
Las llamadas a la API de Axios devuelven un objeto Promise. De la documentación de Axios, "Axios es un cliente HTTP basado en promesas para node.js y el navegador".
Debería esperar en un objeto de promesa para acceder al valor de respuesta. Tenga en cuenta que para usar la palabra clave await en su función, deberá marcarla como async . Haz algo como a continuación.
const fetchData = async(url) => { return await axios.get(url).then(res => res.data.data); } const data = fetchData(giphy_url); console.log(`Data: ${data}`);Ocurrió porque javascript es un lenguaje que no bloquea y la función get de axios es una función de promesa. Entonces, cuando imprima su variable de datos que aún no está llena, debe usarla así.
const fetchData = async (url) => { return axios.get(url).then(res => res.data.data); } // careful that when you want to use await it should be on async function const data = await fetchData(giphy_url); console.log(`Data: ${data}`); // or fetchData(giphy_url).then((data)=>{ console.log(`Data: ${data}`); })Creo que estás manejando axios de manera incorrecta.
const fetchData = async (url) =>{ return await axios.get(url); } const data = fetchData(giphy_url); console.log(`Data: ${data}`)