ReactJS-数组中对象键的setState

小编典典

ReactJS-数组中对象键的setState

reactjs

因此，我已经进行了一段时间的尝试，并认为最好重构我的代码，以便将状态设置为对象数组。我想做的是单击按钮时增加一个数字。

我在组件中有一个回调函数，可触发一个函数来更新状态…但是，我很难将对象内的键值作为目标。

我的初始状态如下：

getInitialState: function() {
    return {
      items: [
        {
          links: 'zest',
          trackId: 1023,
          songTitle: 'z know the others',
          artist: 'zuvet',
          upVotes: 0
        },
        {
          links: 'alpha',
          trackId: 987,
          songTitle: 'ass',
          artist: 'arme',
          upVotes: 3
        },
      ]
    }

我正在尝试锁定upVotes键，但不知道如何操作。我的函数传递了一个键，以便可以将数组中的索引作为目标，但是当我尝试执行以下操作时：this.setState({items[key]:{upVotes: this.state.items[key].upVotes + 1}})由于意外的[令牌，它会引发错误。

我曾尝试与此类似线程的东西在这里，但我不断收到错误。

我可以编写什么样的函数来将要定位的对象的键的setState设置为setState？

阅读 417

2020-07-22

共1个答案

小编典典

获取当前状态，对其进行修改setState()：

var stateCopy = Object.assign({}, this.state);
stateCopy.items[key].upVotes += 1;
this.setState(stateCopy);

注意： 这会改变状态。这是不做任何更改的方法：

var stateCopy = Object.assign({}, this.state);
stateCopy.items = stateCopy.items.slice();
stateCopy.items[key] = Object.assign({}, stateCopy.items[key]);
stateCopy.items[key].upVotes += 1;
this.setState(stateCopy);

2020-07-22