mirror of
https://gitee.com/ant-design/ant-design.git
synced 2024-12-04 21:18:01 +08:00
Merge pull request #16616 from ant-design/fix-selectedRows-bug
fix: 🐞 Fix selectedRows missing when there is childrenColumnName in Table
This commit is contained in:
commit
40836c2440
@ -97,6 +97,7 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
|
|||||||
rowKey: 'key',
|
rowKey: 'key',
|
||||||
showHeader: true,
|
showHeader: true,
|
||||||
sortDirections: ['ascend', 'descend'],
|
sortDirections: ['ascend', 'descend'],
|
||||||
|
childrenColumnName: 'children',
|
||||||
};
|
};
|
||||||
|
|
||||||
CheckboxPropsCache: {
|
CheckboxPropsCache: {
|
||||||
@ -524,7 +525,7 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
|
|||||||
let selectedRowKeys = this.store.getState().selectedRowKeys.concat(defaultSelection);
|
let selectedRowKeys = this.store.getState().selectedRowKeys.concat(defaultSelection);
|
||||||
const key = this.getRecordKey(record, rowIndex);
|
const key = this.getRecordKey(record, rowIndex);
|
||||||
const { pivot } = this.state;
|
const { pivot } = this.state;
|
||||||
const rows = this.getFlatCurrentPageData(this.props.childrenColumnName);
|
const rows = this.getFlatCurrentPageData();
|
||||||
let realIndex = rowIndex;
|
let realIndex = rowIndex;
|
||||||
if (this.props.expandedRowRender) {
|
if (this.props.expandedRowRender) {
|
||||||
realIndex = rows.findIndex(row => this.getRecordKey(row, rowIndex) === key);
|
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) => {
|
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 defaultSelection = this.store.getState().selectionDirty ? [] : this.getDefaultSelection();
|
||||||
const selectedRowKeys = this.store.getState().selectedRowKeys.concat(defaultSelection);
|
const selectedRowKeys = this.store.getState().selectedRowKeys.concat(defaultSelection);
|
||||||
const changeableRowKeys = data
|
const changeableRowKeys = data
|
||||||
@ -760,10 +761,10 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
|
|||||||
};
|
};
|
||||||
|
|
||||||
renderRowSelection(prefixCls: string, locale: TableLocale) {
|
renderRowSelection(prefixCls: string, locale: TableLocale) {
|
||||||
const { rowSelection, childrenColumnName } = this.props;
|
const { rowSelection } = this.props;
|
||||||
const columns = this.columns.concat();
|
const columns = this.columns.concat();
|
||||||
if (rowSelection) {
|
if (rowSelection) {
|
||||||
const data = this.getFlatCurrentPageData(childrenColumnName).filter((item, index) => {
|
const data = this.getFlatCurrentPageData().filter((item, index) => {
|
||||||
if (rowSelection.getCheckboxProps) {
|
if (rowSelection.getCheckboxProps) {
|
||||||
return !this.getCheckboxPropsByItem(item, index).disabled;
|
return !this.getCheckboxPropsByItem(item, index).disabled;
|
||||||
}
|
}
|
||||||
@ -1066,10 +1067,12 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
|
|||||||
}
|
}
|
||||||
|
|
||||||
getFlatData() {
|
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);
|
return flatArray(this.getCurrentPageData(), childrenColumnName);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -670,6 +670,38 @@ describe('Table.rowSelection', () => {
|
|||||||
expect(checkboxAll.instance().state).toEqual({ indeterminate: false, checked: true });
|
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`', () => {
|
it('clear selection className when remove `rowSelection`', () => {
|
||||||
const dataSource = [{ id: 1, name: 'Hello', age: 10 }, { id: 2, name: 'World', age: 30 }];
|
const dataSource = [{ id: 1, name: 'Hello', age: 10 }, { id: 2, name: 'World', age: 30 }];
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user