React antd expandedRowRender - 一次只能打开一行

Question

我创建了一个反应表并使用ant design。

是否存在使用ant设计的解决方案，一次只允许expandedRowRender函数用于一行。

如果展开一行，我想隐藏所有其他展开图标。

Answer 1

这很简单。您需要利用expandedRowKeys组件的<Table />属性。该属性存储当前展开的行键的值。因此，我们要做的只是在其上设置当前扩展的行键并删除任何其他行键。

render()

<Table
    expandedRowKeys={this.state.expandedRowKeys}
    onExpand={this.onTableRowExpand}
/>

onExpand回拨

onTableRowExpand(expanded, record){
    var keys = [];
    if(expanded){
        keys.push(record.id); // I have set my record.id as row key. Check the documentation for more details.
    }

    this.setState({expandedRowKeys: keys});
}

更多阅读： <Table /> API Documentation