Estoy trabajando en una aplicación meteorológica usando React pero tengo este error y no puedo resolverlo
"TypeError: oldCities no es iterable"
Aquí está mi código completo:
import React, { useState } from 'react'; import './App.css'; import Nav from './components/Nav'; import Cards from './components/Cards.jsx' export default function App() { const [cities, setCities] = useState() console.log(setCities) const apiKey = 'api_key' function onSearch(city){ fetch(`http://api.openweathermap.org/data/2.5/weather?q=${city}&appid=${apiKey}&units=metric`) .then(response => response.json()) .then(json => { if(json.main !== undefined){ const city = { min: Math.round(json.main.temp_min), max: Math.round(json.main.temp_max), id: json.id, img: json.weather[0].icon, wind: json.wind.speed, temp: json.main.temp, name: json.name, logitude: json.coord.lon, latitude: json.coord.lat }; setCities(oldCities => [...oldCities, city]) } else{ alert('Ciudad no encontrada') } }) .catch(e => console.log(e)) } return ( <div className="App"> { /* Tu código acá: */ } <Nav onSearch={onSearch} /> <Cards cities={cities} /> </div> ); }¿Alguna idea sobre cómo puedo agregar los datos a setCities de una manera diferente?
Como está trabajando con React, asumiría que su código se ve así
const [oldCities, setCities] = useState([])No estoy seguro de para qué se usa oldCities, pero si desea agregar el valor de la ciudad que obtiene de su llamada API, debería ser
setCities([...oldCities, new_city ]) // Append to cities array // Note here to not use oldCities.append // bc it will preserve the memory address of the array // and hence not update the component state