En el código actual, estoy tomando datos en ciudades y luego los concateno con la búsqueda. La búsqueda tiene los datos en este formato (Delhi, Dehradun, Kotdwara, Pune) y cuando los paso a través de la API, selecciona el primer elemento (Delhi) y muestra solo sus datos. Lo que quiero es elegir todas las ciudades una por una y pasarlas por API una por una. La API se ejecutará varias veces.
const [city, setCity] = useState(null); const [search, setSearch] = useState(""); const [istru, setIstru] = useState(false); const cities = ["Delhi","Dehradun","Kotdwara","Pune"]; if(istru==false) { setSearch(search.concat(cities)) setIstru(true); } const getCity = async (search) => { const url = `https://api.openweathermap.org/data/2.5/weather?q=${search}&units=metric&appid=7938d9005e68d8b258a109c716436c91`; const response = await fetch(url); const resJson = await response.json(); const city = resJson.main; return city; }; const getAllCities = async() => { const promises = cities.map(city => getCity(city)) const cities = await Promise.all(promises); // Do whatever you want with all cities } useEffect(() => { getAllCities(); }, [cities]); return( {!city ? ( <p className="errorMsg">Enter City Name</p> ) : ( <div> <div className="info"> <h2 className="location"> <i className="fa-solid fa-street-view"> </i>{search} </h2> <h1 className="temp"> {cities.temp} </h1> <h3 className="tempmin_max"> Min : {cities.temp_min} | Max : {cities.temp_max} </h3> </div> )```Si quieres hacer uno por uno puedes hacer algo como esto:
const getCity = async (search) => { const url = `https://api.openweathermap.org/data/2.5/weather?q=${search}&units=metric&appid=7938d9005e68d8b258a109c716436c91`; const response = await fetch(url); const resJson = await response.json(); const city = resJson.main; return city; }; const getAllCities = async() => { const promises = cities.map(city => getCity(city)) const cities = await Promise.all(promises); // Do whatever you want with all cities } useEffect(() => { getAllCities(); }, [cities]);