3

我正在尝试在 Blueprints JS 表中的单元格上捕获 onClick 事件。我的目标是在同级组件中触发一个方法,该方法将显示有关表中选定(单击)行的信息。

在谷歌搜索主题时,我发现了这个拉取请求,其中贡献者的评论来自themadcreator提示的使用selectedRegionTransform。他还举了一个例子

如果要单击一行,则应使用 selectedRegionTransform。这将允许拖动选择和多选保持不变。PR 预览页面中有一个示例可以执行此操作。

可悲的是,我找不到那个例子。

在我的组件中,我有这两种方法(有点简化)

test(a,b) {
    console.log(a,b)
}

render() {
    return(
        <Table numRows={this.state.data.length} selectedRegionTransform={this.test}>
            <Column name="Title" cellRenderer={this.renderTitleCell} />
        </Table>
    )
}

从某种意义上说,这log(a,b)在方法test中向我显示了两个对象。一个带有网格坐标,一个带有鼠标事件信息。然后它与此消息中断。

Uncaught TypeError: Cannot read property 'cols' of undefined
at Function../node_modules/@blueprintjs/table/lib/esm/regions.js.Regions.getRegionCardinality (regions.js:97)
at Table._this.styleMenuRegion (table.js:259)
...

我确定这是因为我不知道如何使用selectedRegionTransform,因此需要一些帮助。

我希望表能够正常响应事件。我只需要一个钩子来触发我自己的功能以及表格的正常功能。

有人可以帮我理解这是如何完成的吗?谢谢!

4

1 回答 1

5

您收到该错误是因为selectedRegionTransform期望您返回一个新IRegion对象。此功能允许您截取当前区域选择并在渲染之前对其进行更改。在我的例子中,我使用它将单元格选择转换为行选择。

selectedRegionTransform={(e) => {
    return {
        rows: e.rows
    }
}}

注意:您还可以返回cols指定要选择的列。

于 2019-07-15T21:20:36.853 回答