我正在尝试将数据绑定到blueprint.js
Table
上,但是文档尚不清楚如何执行此操作。如何为blueprint.js
Table
创建自定义渲染功能,以从对象列表中渲染键?
在示例中,rowIndex
默认为传递。
代码:
data = [
{ name: "L/S", col2: "abc" },
{ name: "HY", col2: "def" }
];
myRender = (rowIndex: number, key: string) => {
return <Cell> {this.data[rowIndex][key]} </Cell>;
};
<Table numRows={2}>
<Column name="not-working" cellRenderer={this.myRender("name")} />
<Column name="not-working2" cellRenderer={this.myRender("col2")} />
</Table>;
错误:
TypeError
Cannot read property 'undefined' of undefined
18 |
19 | myRender = (rowIndex: number, key: string) => {
> 20 | return <Cell> {this.data[rowIndex][key]} </Cell>;
| ^
21 | };
在此处查看示例: https://codesandbox.io/s/k9l9q2150r
答案 0 :(得分:6)
cellRenderer
需要一个以rowIndex
作为参数的函数。所以这就是你需要做的:
myRender = (key: string) => (rowIndex: number) => {
return <Cell>{this.data[rowIndex][key]}</Cell>;
};
这是sandbox