表（固定数据表）第一行的 React Redux 复选框保持选中状态

Posted 2023-02-21

【中文标题】表（固定数据表）第一行的 React Redux 复选框保持选中状态

【英文标题】：React Redux checkbox on top row of table (fixed-data-table) remains checked

【发布时间】：2017-02-22 20:18:02

【问题描述】：

我在使用 Redux on React 时遇到了一个奇怪的问题，它使用固定数据表生成的表，其行取决于计算的状态变量。

每一行都有一个复选框，以便能够批量选择数据。当按下一个按钮时，所有选中的行都会隐藏，这就是问题出现的时候：如果顶行被选中而下面的行没有被选中，当重新呈现表格时，顶行复选框仍然处于选中状态 （在原来的顶行被隐藏之后）。

显示数据的普通列是动态生成的，但带有复选框的列是这样生成的：

<Column
 width=75
 header=<Cell>Check</Cell>
 columnKey="selectCol"
 cell=(rowIndex, ...props) => (
  <Cell>
   <input type="checkbox" onChange=(e) => 
     var chk = e.target;
     /* stuff that doesn't affect whether it's checked or not when rendered */
    
  </Cell>
 )
/>

有人知道会发生什么吗？非常感谢

【参考方案1】：

您需要设置每个复选框的值。我的意思是在每个复选框的初始状态下将其设为 false。然后在 onchange 发生时使目标事件成为 true。因此，无论何时动态生成复选框对象，每个单元格都有一个唯一 id，根据您的选择对应于某个值（initialState = true/false）。之后根据您的选择继续更新状态。

【讨论】：

但是如何更新复选框的状态呢？我无法更新它，因为包含复选框的每个单元格都是由固定数据表组件生成的。

你能举个例子吗？我已经设法更新了状态，但顶行仍然处于选中状态。