test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-12-04 13:08:41 +08:00
Code Issues Actions 100 Packages Projects Releases Wiki Activity

Merge pull request #16616 from ant-design/fix-selectedRows-bug

Browse Source 
fix: 🐞 Fix selectedRows missing when there is childrenColumnName in Table
This commit is contained in:
偏右 2019-05-16 15:10:48 +08:00 committed by GitHub
commit 40836c2440
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 41 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
components/table/Table.tsx
View File

@ -97,6 +97,7 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
rowKey: 'key',
showHeader: true,
sortDirections: ['ascend', 'descend'],
childrenColumnName: 'children',
};
CheckboxPropsCache: {
@ -524,7 +525,7 @@ export default class Table<T> extends React.Component<TableProps<T>, 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<T> extends React.Component<TableProps<T>, 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<T> extends React.Component<TableProps<T>, 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<T> extends React.Component<TableProps<T>, 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);
}

32
components/table/__tests__/Table.rowSelection.test.js
View File

@ -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(
<Table
columns={columns}
dataSource={newDatas}
childrenColumnName="list"
rowSelection={{ onChange }}
expandedRowKeys={[1]}
/>,
);
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 }];