【问题标题】:Selecting row(s) imperatively强制选择行
【发布时间】:2021-09-08 07:05:36
【问题描述】:
有没有办法在mui-datatables 中设置一行或多行强制检查?
在文档中,我发现唯一接近的是一个传递给 customToolbarSelect 的 setSelectedRows 函数,但您只能在手动选择一行后将此函数作为触发器访问。
我希望能够在数据表组件之外编写一个可以更改行的“已检查”状态的函数。特别是能够将页面上的所有行设置为已选中,而无需将每个页面中的每一行都设置为已选中。内置的“全选”功能只执行后者。
【问题讨论】:
标签:
reactjs
mui-datatable
【解决方案1】:
看起来答案是将状态对象传递给 rowsSelected 道具,如下所示:
// selected rows is an array of indices
const [selectedRows, setSelectedRows] = React.useState([3]);
const options: MUIDataTableOptions = {
...
rowsSelected: selectedRows, // on init, the 4th row will be checked
...
}
return (
<>
<Button onClick={() => setSelectedRows([1, 2, 3])}>Change!</Button>
<MUIDataTable ... options={options} />
</>
)
单击Change! 按钮会将第二、第三和第四行设置为选中并取消选中所有其他行。