OnClick事件 - 在React表中更改单行数据

Question

我在我的React表中有一个列，该列使用变量（命名项目）用于显示其数据。如下所示：

{
  Header: this.generateHeaderCell(this.props.headers[3]),
  accessor: 'last_updated_status',
  Cell: (props: any) => <DateSinceFormat date={props.value} item={item}/>,
  maxWidth: 85,
  filterable: false
}

因此，当变量 item 的值是1时，它会显示一些数据，并且当它更改时会显示其他内容。

我正在使用OnClick事件来更改 item 的值。

onRowClick = (state, rowInfo, column, instance) => {
    return {
        onClick: e => {
            if(item === '2') {
                item = '1';
            } else {
                item = '2';
            }
            instance.forceUpdate();
        }
    };
}

我在这里遇到的问题是，我只想更新特定行的值，但是用户单击了，但是，现在所有的行都已更新。

请在这里帮助我，让我知道如何解决此问题。

Answer 1

在所有行之间共享item的值。您可以尝试将item属性添加到rowInfo（我认为它是对象），然后将onClick()函数更改为

onClick: e => {
         if(rowInfo.item === '2') 
         {
             rowInfo.item = '1';
         } 
         else 
         {
             rowInfo.item = '2';
         }
   instance.forceUpdate();
}