javascript - 如何使用 react-table 仅重新渲染更新的行？

Question

我正在尝试使用 react-table 实现可编辑的数据网格。代码如下所示：

<ReactTable
  data={data}
  columns={columns}
/>

我面临的问题是，每当更新特定行中的单元格值时，都会重新渲染整个可见页面。

这是库创建者的分叉沙箱，它说明了这个问题。

我在想如果反应表在单个单元格中有更新时重新呈现整个页面，那么它的效率相当低。或者我不确定我是否遗漏了什么。

任何帮助我们都非常感谢。提前致谢！

Answer 1

首先要注意：仅仅因为您在 Cell 回调中记录“调用行渲染”并不一定意味着 DOM 被重新渲染。只有当 的输出与之前的不同时，它才会重新渲染render。

在这种情况下，对于每一行，它都是不同的，因为您正在new Date为每一行计算 a。您需要一种方法来检查哪一行是正在更新的行，并且只返回该行的新日期。