Reactjs 材质表如何选择一行在选择时更改背景色

使用材质表库。 我想复制本例中所示的行为

我正在考虑使用onRowClick={}

逻辑是

onRowClick=>

设置组件状态下的值，将单击的行背景渲染为不同的颜色

将所有其他“背景”行设置为原始颜色

我可以基于状态中保留的值使用条件渲染来更改背景。尽管这会更改所有行的背景

options={
   rowStyle:{backgroundColor: this.state.selected ? '#fff' : this.state.c}
}

我当前的工作示例如下

感谢您的帮助

该软件包提供了一个示例，说明如何使用

选项

道具来实现这一点

---

我用叉子叉了你的沙箱。

你还需要传递

selectedRowId

否则一切都会变成蓝色。另外，

rowStyle

选项接受回调，您可以这样调用：

rowStyle: rowData => ({
backgroundColor: this.state.selected && rowData.tableData.id === this.state.selectedRowId 
?   this.state.c
    : "#fff" 
})

您的

onRowClick

也需要一些工作（选择/取消选择条件不正确）。