Fix error when Table[pagination] change, close #4532

This commit is contained in:
afc163 2017-01-09 20:49:00 +08:00
parent 7548f2068f
commit 1c493ad798
2 changed files with 40 additions and 13 deletions

View File

@ -134,18 +134,12 @@ export default class Table<T> extends React.Component<TableProps<T>, any> {
'fixed columns instead, see: http://u.ant.design/fixed-columns.'
);
const pagination = props.pagination || {};
this.columns = props.columns || normalizeColumns(props.children);
this.state = assign({}, this.getSortStateFromColumns(), {
// 减少状态
filters: this.getFiltersFromColumns(),
pagination: this.hasPagination() ?
assign({}, defaultPagination, pagination, {
current: pagination.defaultCurrent || pagination.current || 1,
pageSize: pagination.defaultPageSize || pagination.pageSize || 10,
}) : {},
pagination: this.getDefaultPagination(props),
});
this.CheckboxPropsCache = {};
@ -179,6 +173,15 @@ export default class Table<T> extends React.Component<TableProps<T>, any> {
.map((record, rowIndex) => this.getRecordKey(record, rowIndex));
}
getDefaultPagination(props) {
const pagination = props.pagination || {};
return this.hasPagination(props) ?
assign({}, defaultPagination, pagination, {
current: pagination.defaultCurrent || pagination.current || 1,
pageSize: pagination.defaultPageSize || pagination.pageSize || 10,
}) : {};
}
getLocale() {
let locale = {};
if (this.context.antLocale && this.context.antLocale.Table) {
@ -188,11 +191,16 @@ export default class Table<T> extends React.Component<TableProps<T>, any> {
}
componentWillReceiveProps(nextProps) {
if (('pagination' in nextProps) && nextProps.pagination !== false) {
if ('pagination' in nextProps) {
this.setState(previousState => {
const newPagination = assign({}, defaultPagination, previousState.pagination, nextProps.pagination);
newPagination.current = newPagination.current || 1;
return { pagination: newPagination };
newPagination.pageSize = newPagination.pageSize || 10;
return { pagination: nextProps.pagination !== false ? newPagination : {} };
});
} else {
this.setState({
pagination: this.getDefaultPagination(nextProps),
});
}
if (nextProps.rowSelection &&
@ -263,8 +271,8 @@ export default class Table<T> extends React.Component<TableProps<T>, any> {
}
}
hasPagination() {
return this.props.pagination !== false;
hasPagination(props?: any) {
return (props || this.props).pagination !== false;
}
isFiltersChanged(filters) {
@ -401,7 +409,7 @@ export default class Table<T> extends React.Component<TableProps<T>, any> {
}
// Controlled current prop will not respond user interaction
if (props.pagination && 'current' in (props.pagination as Object)) {
if (typeof props.pagination === 'object' && 'current' in (props.pagination as Object)) {
newState.pagination = assign({}, pagination, {
current: this.state.pagination.current,
});
@ -508,7 +516,7 @@ export default class Table<T> extends React.Component<TableProps<T>, any> {
pagination,
};
// Controlled current prop will not respond user interaction
if (props.pagination && 'current' in (props.pagination as Object)) {
if (typeof props.pagination === 'object' && 'current' in (props.pagination as Object)) {
newState.pagination = assign({}, pagination, {
current: this.state.pagination.current,
});

View File

@ -75,4 +75,23 @@ describe('Table.pagination', () => {
{}
);
});
it('should display pagination as prop pagination changed', () => {
const wrapper = mount(createTable());
expect(wrapper.find('.ant-pagination')).toHaveLength(1);
expect(wrapper.find('.ant-pagination-item')).toHaveLength(2);
wrapper.setProps({ pagination: false });
expect(wrapper.find('.ant-pagination')).toHaveLength(0);
wrapper.setProps({ pagination });
expect(wrapper.find('.ant-pagination')).toHaveLength(1);
expect(wrapper.find('.ant-pagination-item')).toHaveLength(2);
wrapper.find('.ant-pagination-item-2').simulate('click');
expect(renderedNames(wrapper)).toEqual(['Tom', 'Jerry']);
wrapper.setProps({ pagination: false });
expect(wrapper.find('.ant-pagination')).toHaveLength(0);
wrapper.setProps({ pagination: true });
expect(wrapper.find('.ant-pagination')).toHaveLength(1);
expect(wrapper.find('.ant-pagination-item')).toHaveLength(1); // pageSize will be 10
expect(renderedNames(wrapper)).toEqual(['Jack', 'Luck', 'Tom', 'Jerry']);
});
});