反应表 - 不刷新内容

Posted 2023-02-19

【中文标题】反应表 - 不刷新内容

【英文标题】：React table- doesn't refresh content

【发布时间】：2019-01-26 02:01:42

【问题描述】：

我正在尝试刷新使用此库react-table 生成的表中的内容。但是，由于某种原因，它不起作用，即使我更改了传递给组件的参数的状态。

<ReactTable
   data=this.state.data
   columns=this.state.headers
/>

以及改变数据的函数：

  let data= this.state.data;
  for (var i = 0; i < data.length; i++) 
    data[i].name="TEST"
  
  this.setState(data: data)

我可以看到数据发生了变化，但表格的内容保持不变。

【问题讨论】：

作为建议，不要将您的状态数据分配给这样的变量。使用Object.assign 或扩展语法：let data = [ ...this.state.data ] 另外，不要像那样更改键的值，因为如果您以这种方式更改，您的原始对象也会发生变异。按照@Shishir Arora 的回答建议使用.map。这适用于扩展语法，因为它会进行浅拷贝。

【参考方案1】：

let data= this.state.data;
const newData = data.map(d=>(...d, name:"Test"));
this.setState(data: newData)

使用上面的代码。原因：React 没有看到突变。