From c4128c0d14648aa749caa3153a4fe5e446986033 Mon Sep 17 00:00:00 2001 From: afc163 Date: Thu, 16 May 2019 14:50:24 +0800 Subject: [PATCH] :bug: Fix selectedRows missing when there is childrenColumnName in Table close #16614 --- components/table/Table.tsx | 15 +++++---- .../__tests__/Table.rowSelection.test.js | 32 +++++++++++++++++++ 2 files changed, 41 insertions(+), 6 deletions(-) diff --git a/components/table/Table.tsx b/components/table/Table.tsx index d9d9a72f8a..c6273fb374 100755 --- a/components/table/Table.tsx +++ b/components/table/Table.tsx @@ -97,6 +97,7 @@ export default class Table extends React.Component, TableState< rowKey: 'key', showHeader: true, sortDirections: ['ascend', 'descend'], + childrenColumnName: 'children', }; CheckboxPropsCache: { @@ -524,7 +525,7 @@ export default class Table extends React.Component, TableState< let selectedRowKeys = this.store.getState().selectedRowKeys.concat(defaultSelection); const key = this.getRecordKey(record, rowIndex); const { pivot } = this.state; - const rows = this.getFlatCurrentPageData(this.props.childrenColumnName); + const rows = this.getFlatCurrentPageData(); let realIndex = rowIndex; if (this.props.expandedRowRender) { realIndex = rows.findIndex(row => this.getRecordKey(row, rowIndex) === key); @@ -604,7 +605,7 @@ export default class Table extends React.Component, TableState< }; handleSelectRow = (selectionKey: string, index: number, onSelectFunc: SelectionItemSelectFn) => { - const data = this.getFlatCurrentPageData(this.props.childrenColumnName); + const data = this.getFlatCurrentPageData(); const defaultSelection = this.store.getState().selectionDirty ? [] : this.getDefaultSelection(); const selectedRowKeys = this.store.getState().selectedRowKeys.concat(defaultSelection); const changeableRowKeys = data @@ -760,10 +761,10 @@ export default class Table extends React.Component, TableState< }; renderRowSelection(prefixCls: string, locale: TableLocale) { - const { rowSelection, childrenColumnName } = this.props; + const { rowSelection } = this.props; const columns = this.columns.concat(); if (rowSelection) { - const data = this.getFlatCurrentPageData(childrenColumnName).filter((item, index) => { + const data = this.getFlatCurrentPageData().filter((item, index) => { if (rowSelection.getCheckboxProps) { return !this.getCheckboxPropsByItem(item, index).disabled; } @@ -1066,10 +1067,12 @@ export default class Table extends React.Component, TableState< } getFlatData() { - return flatArray(this.getLocalData(null, false)); + const { childrenColumnName } = this.props; + return flatArray(this.getLocalData(null, false), childrenColumnName); } - getFlatCurrentPageData(childrenColumnName: string | undefined) { + getFlatCurrentPageData() { + const { childrenColumnName } = this.props; return flatArray(this.getCurrentPageData(), childrenColumnName); } diff --git a/components/table/__tests__/Table.rowSelection.test.js b/components/table/__tests__/Table.rowSelection.test.js index 8d777ba3ef..a98086d3c3 100644 --- a/components/table/__tests__/Table.rowSelection.test.js +++ b/components/table/__tests__/Table.rowSelection.test.js @@ -670,6 +670,38 @@ describe('Table.rowSelection', () => { expect(checkboxAll.instance().state).toEqual({ indeterminate: false, checked: true }); }); + // https://github.com/ant-design/ant-design/issues/16614 + it('should get selectedRows correctly when set childrenColumnName', () => { + const onChange = jest.fn(); + const newDatas = [ + { + key: 1, + name: 'Jack', + list: [ + { + key: 11, + name: 'John Brown', + }, + ], + }, + ]; + const wrapper = mount( + , + ); + const checkboxes = wrapper.find('input'); + checkboxes.at(2).simulate('change', { target: { checked: true } }); + expect(onChange).toHaveBeenLastCalledWith([11], [newDatas[0].list[0]]); + checkboxes.at(1).simulate('change', { target: { checked: true } }); + const item0 = { ...newDatas[0], list: undefined }; + expect(onChange).toHaveBeenLastCalledWith([11, 1], [item0, newDatas[0].list[0]]); + }); + it('clear selection className when remove `rowSelection`', () => { const dataSource = [{ id: 1, name: 'Hello', age: 10 }, { id: 2, name: 'World', age: 30 }];