每次调用函数时，向数组中添加新元素

Question

这可能很容易，但每次单击"添加到收藏夹"按钮时，我都会尝试将当前天气位置添加到数组中。每次用户搜索其他位置时，位置都会发生变化。所以每次他在寻找新的位置时，我都希望能够将其添加到数组中，这样我就可以在特定页面上显示所有最喜欢的位置。现在，每次调用函数时，它都在工作，但如果我用另一个位置再次调用，它会重写第一个位置，数组只保留一个元素。有人帮忙吗？

感谢

let arr = [];
const favCity = () => {
debugger;
let newArr = [...arr];
let favCity = weatherSelector.weatherInfo.location.name;
newArr.push(favCity);
arr.push(newArr[0]);
};


<div className="details">
<div className="weather_text">
<div className="city_tempa">
<p className="city_name" onChange={(e) => favCity("city", e.target.value)}>
{weatherSelector.weatherInfo.location.name}
</p>
<p className="city_name">, {weatherSelector.weatherInfo.location.country}</p>
<br />
<p className="city_temp">{Math.round(weatherSelector.weatherInfo.current.temp_c * 10) / 10}c°</p>
</div>
<div className="weather_icon">
<img className="city_icon" src={weatherSelector.weatherInfo.current.condition.icon} />
<p className="city_text">{weatherSelector.weatherInfo.current.condition.text}</p>
</div>
<div className="fav">
<button className="fav_btn" onClick={favCity}>
Add to Favorite
</button>
</div>
</div>

谢谢大家：(

Answer 1

您需要的数组是newArr，它包含新的位置。所以你只需要将这个newArr分配给arr.

let arr = [];

const favCity = () => {
let newArr = [...arr];
let favCity = weatherSelector.weatherInfo.location.name;
newArr.push(favCity);
arr = newArr
};

Answer 2

选择新位置是否正在重新加载页面？因为你的代码似乎没有任何问题(只要我们无故忽略创建新数组，你就可以执行arr.push(favCity(.

因为这意味着arr = []将再次被初始化。。。如果你能发布最小的可复制的例子(比如codepen.io(，这肯定会澄清的一些事情