reactjs - 更改 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编辑它并进入列表对象的屏幕显示。我有按钮，我想单击它并更改其中一个对象。通过列表中的项目，我使用“地图”功能。结果，我正在尝试像下面的代码那样做：

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;
      })
   });
}