如何通过单击按钮展开Antd表行

时间:2017-12-26 11:02:24

标签: antd

版 3.0.3

环境 个人电脑,铬

复制链接 https://codesandbox.io/s/my02ok19wy

重现的步骤 现在,Table可以通过两种方式扩展行:1。在第一列中使用图标; 2.单击expandRowByClick为true的整行。 但那些不是我想要的。我想在其他列中使用该按钮,也许按钮会显示更多'。然后,当我点击“显示更多”时,该行将展开。怎么实现这个?

点击演示节目,我想通过点击展开排名'显示更多'而不是单击第一个单元格中的按钮。感谢

预期结果如何? 单击不在第一个单元格中的一个按钮

,展开一行

实际发生了什么? 必须单击行的第一个单元格中的按钮。按钮无法移动到其他单元格。

1 个答案:

答案 0 :(得分:0)

这是可能的,但我不想为你做代码,但我会解释如何。

有一个道具调用<my-date-picker [options]="myDatePickerOptions" [(ngModel)]="Date" (dateChanged)="onDateChanged($event)" #ngRef="ngModel" required id="Date" name="Date" ngModel> </my-date-picker> private myDatePickerOptions: IMyOptions = { dateFormat: 'yyyy.mm.dd', }; Public effectiveDate : string; OnDateChanged(event: IMyDateModel) { this.effectiveDate = event.formatted; } ,您可以在其中指定要展开的行的键。

所以 将expandedRowKeys添加到expandedRowKeys={[1,3]}会扩展第一行和第三行。

现在,您只需要实现<Table />函数来操作行键数组。以及

之类的东西

handleClickMore