在 setState 中更改 object.item

Question

如何通过 setState 更改 getInitialState 中对象中的项目？

例如：

getInitialState: function() {
  return {list: [
    {id:'1',
      title: 'The Baby Boss',
      year: '2017',
      quality: 'Blu-ray',
      stars: ['Fred Astaire, ', 'Humphrey Bogart, ', 'Marlon Brando, ', 'Richard Burton, ', 'Charlie Chaplin'],
      Show: false
    },
    {
      id:'2',
      title: 'Pirates of the Caribbean: Dead Men Tell No Tales ',
      year: '2016',
      quality: 'HDrip',
      stars: ['John Depp, ', 'Orlando Bloom, ', 'Javier Bardem, ', 'Kaya Scodelario, ', 'Brenton Thwaites'],
      Show: true
    }`

更清晰。我创建了 getInitialState，然后 render 编辑了它，并在屏幕上显示了列表对象。我有按钮，我想单击它并更改其中一个对象中的 smth。通过列表中的项目，我使用 'map' 函数。结果，我正在尝试像下面的代码那样做：

this.setState({
  film.Show: false
})

但是这种方式行不通。达到我的目标的哪种方法是正确的？感谢您的想法。

Answer 1

您需要找到您的目标项目并更新它：

someEventHandler: function(targetId) {
   this.setState({
      list: this.state.list.map(function(film) {
         if (film.id === targetId) {
            film.Show = false;
         }
         return film;
      })
   });
}

在 setState 中更改 object.item

change object.item in setState

setstate

reactjs