如何以编程方式清除材质 ui table 的行选择？

Question

我使用 materialui table 来呈现这样的项目列表：

    <Table selectable={true} onRowSelection={(index) => this.onRowSelection(index)} className="searchable-table">
        <TableHeader adjustForCheckbox={false} displaySelectAll={false} style={style}>
            <TableRow style={style}>
                <TableHeaderColumn>
                    <TextField
                        hintText="search"
                        onChange={(e) => this.onSearch(e)}
                        fullWidth={false} />
                </TableHeaderColumn>
            </TableRow>
        </TableHeader>
        <TableBody displayRowCheckbox={false} deselectOnClickaway={true}>
            {this.renderRows(this.state.data)}
        </TableBody>
    </Table>

当我单击一行时，onRowSelection 会按预期触发，并且该行被选中（突出显示）。如果我想再次触发 onRowSelection，我必须点击所选行两次。一个取消选择它，另一个点击再次触发 onRowSelection。

我怎样才能让它不被选中并且在每次点击时触发 onRowSelected，而不需要先取消选择该行？

Answer 1

如果您不希望它被选中，我认为 onRowSelection 不应该被解雇并且 selectable 应该是错误的。也许你可以试试 onCellClick.

   <Table selectable={false} onCellClick={(row, column, event) => this.onCellClick(row, column, event)} className="searchable-table">
        <TableHeader adjustForCheckbox={false} displaySelectAll={false} style={style}>
            <TableRow style={style}>
                <TableHeaderColumn>
                    <TextField
                        hintText="search"
                        onChange={(e) => this.onSearch(e)}
                        fullWidth={false} />
                </TableHeaderColumn>
            </TableRow>
        </TableHeader>
        <TableBody displayRowCheckbox={false} deselectOnClickaway={true}>
            {this.renderRows(this.state.data)}
        </TableBody>
    </Table>

行索引应该是处理函数的第一个参数（我将其重命名为 onCellClick）。

如何以编程方式清除材质 ui table 的行选择？

How can I clear row selection of a materialui table programatically?

reactjs

material-ui