Ant-design 中 Tbale 可展开手动操作范例

[gaofant101]

在官网只展示了提供按钮的可展开,没有详细介绍主动触发调用界面展开API;

在经过一翻查找过后,可以通过expandedRowKeys和expandedRowKeys这个2个API实现;

下面是截取的部分代码展示:

onExpandedRowsChange(rows) {
    this.setState({
        expandedRowKeys: rows,
    });
}
showTCellInfo(key) {
    if (this.state.expandedRowKeys.length) {
        this.setState({
            expandedRowKeys: [],
        });
    } else {
        this.setState({
            expandedRowKeys: [key],
        });
    }
}

<Table
  columns={tableColumns}
  expandedRowKeys={expandedRowKeys}
  onExpandedRowsChange={this.onExpandedRowsChange}
  expandedRowRender={(record) => <p>{record.description}</p>}
  dataSource={dataSource}
/>

上面代码还需要进一步完善,expandedRowKeys这里面的值需要准确的判断;

官方示例

[afc163]

对，这个遵循了通用的 React 受控模式，演示不太可能把所有可能都演示一遍。

[gaofant101]

@afc163 就官方文档而言,已经做的非常完善了;
如果开发者自己想要做什么操作,有心人总能找到答案.