使用 setState() 将对象添加到对象数组中

Question

我的组件的状态是一个对象数组：

this.state = {
  userFavorites: [{id: 1, title: 'A'}, {id: 2, title: 'B'}]
}

每次单击按钮时，我都需要使用另一个对象更新我的状态，就像上面状态中的对象一样；例如：{id：3，标题：'C'}。

如果我只是将它们连接起来并设置状态，则最后一个对象会不断被添加的对象更改。

我这里需要展开运算符吗？

Answer 1

你应该这样做。以下是在 React 中将值或对象推送到数组的最推荐方法

 this.setState( prevState => ({
     userFavorites: [...prevState.userFavourites,  {id: 3, title: 'C'}]
 }));

要推到数组的开头，请这样做

   this.setState( prevState => ({
     userFavorites: [{id: 3, title: 'C'}, ...prevState.userFavourites]
  }));

Answer 2

const userFavorites = [...this.state.userFavorites, {id: 3, title: 'C'}]
this.setState({ userFavorites })