Tengo una aplicación para mostrar los datos del clima, 1 componente resuelve una api de ubicación y otra para mostrar los datos del clima dependiendo de esa ubicación.
Lo estoy haciendo con useEffect pero me sale error como que no estoy recibiendo los datos.
Componente de ubicación:
Aqui lo que hago es obtener la ubicacion pasandole la longitud y latitud, retornandola y exportandola
const getData= async (long, lat)=>{
const promise= await fetch(`https://api.mapbox.com/geocoding/v5/mapbox.places/${long},${lat}.json?access_token=pk.eyJ1IjoiZGV4Y2FybG9zIiwiYSI6ImNrb2hzNmd6MjBudGQybmxsMHFybjNvZW0ifQ.VTlqEeCl-zmlMFe-5_fYJQ`)
const results = await promise.json()
return results
}
export default getData
Componente de clima:
Aquí obtengo la información del clima pasando el nombre de la ciudad
const getWeatherData= async(name)=>{
const api = {
key: "key",
base: "https://api.openweathermap.org/data/2.5/"
}
const promises = await fetch(`${api.base}weather?q=${name}&units=metric&APPID=${api.key}`)
const results = await promises.json()
return results
}
export default getWeatherData
aquí ya junto los dos componentes en el useEffect pero el error mencionado anteriormente.
navigator.geolocation.getCurrentPosition(function(data){
setLongitude( data.coords.longitude); //longitud
setLatitude( data.coords.latitude)}) // latitud
useEffect(()=>{
getData(longitude,latitude).then(data=>{ //COMPONENTE1, aqui le paso la lon y lat
console.log(data) //al hacer un console.log si me muestra los datos en consola correctamente
let city_name=data.features[1].text // guardo en una variable el nombre de la ciudad pero aqui me sale un error de **Uncaught (in promise) TypeError: Cannot read property 'text' of undefined at weather.js:27**
getWeatherData(city_name) //COMPONENTE2 aqui le paso el nombre de la ciudad
.then(result => {
setWeather(result); //guardo los resultados del clima en una variable de estado
});
})
},[])
[![aqui es el console.log(data)][1]][1]
[1]: https://i.sstatic.net/Sl3Sl.png
https://api.openweathermap.org/data/2.5/weather?q=London&units=metric&APPID=5b881f6447593d97ee91f3b5027f1e09
no da el features y si quieres obtener el nombre de la ciudad, el camponame
nomas es data.name y aqui puedes usar un operador para validar si existe o no,data.name ?? "no existe"