Fix table filter in JSX (#4765)

Fix #4759
This commit is contained in:
Wei Zhu 2017-02-08 14:43:00 +08:00 committed by ddcat1115
parent a07c71165a
commit f84dfbbaa9
2 changed files with 47 additions and 6 deletions

View File

@ -194,6 +194,7 @@ export default class Table<T> extends React.Component<TableProps<T>, any> {
}
componentWillReceiveProps(nextProps) {
this.columns = nextProps.columns || normalizeColumns(nextProps.children);
if ('pagination' in nextProps || 'pagination' in this.props) {
this.setState(previousState => {
const newPagination = assign({}, defaultPagination, previousState.pagination, nextProps.pagination);
@ -222,17 +223,17 @@ export default class Table<T> extends React.Component<TableProps<T>, any> {
this.CheckboxPropsCache = {};
}
if (this.getSortOrderColumns(nextProps.columns).length > 0) {
const sortState = this.getSortStateFromColumns(nextProps.columns);
if (this.getSortOrderColumns(this.columns).length > 0) {
const sortState = this.getSortStateFromColumns(this.columns);
if (sortState.sortColumn !== this.state.sortColumn ||
sortState.sortOrder !== this.state.sortOrder) {
this.setState(sortState);
}
}
const filteredValueColumns = this.getFilteredValueColumns(nextProps.columns);
const filteredValueColumns = this.getFilteredValueColumns(this.columns);
if (filteredValueColumns.length > 0) {
const filtersFromColumns = this.getFiltersFromColumns(nextProps.columns);
const filtersFromColumns = this.getFiltersFromColumns(this.columns);
const newFilters = assign({}, this.state.filters);
Object.keys(filtersFromColumns).forEach(key => {
newFilters[key] = filtersFromColumns[key];
@ -241,8 +242,6 @@ export default class Table<T> extends React.Component<TableProps<T>, any> {
this.setState({ filters: newFilters });
}
}
this.columns = nextProps.columns || normalizeColumns(nextProps.children);
}
setSelectedRowKeys(selectedRowKeys, { selectWay, record, checked, changeRowKeys }: any) {

View File

@ -194,4 +194,46 @@ describe('Table.filter', () => {
dropdownWrapper.find('.confirm').simulate('click');
expect(renderedNames(wrapper)).toEqual(['Jack']);
});
it('works with JSX in controlled mode', () => {
const { Column } = Table;
class App extends React.Component {
state = {
filters: {},
}
handleChange = (pagination, filters) => {
this.setState({ filters });
}
render() {
return (
<Table dataSource={data} onChange={this.handleChange}>
<Column
title="name"
dataIndex="name"
key="name"
filters={[
{ text: 'Jack', value: 'Jack' },
{ text: 'Lucy', value: 'Lucy' },
]}
filteredValue={this.state.filters.name}
onFilter={filterFn}
/>
</Table>
);
}
}
const wrapper = mount(<App />);
const dropdownWrapper = mount(wrapper.find('Trigger').node.getComponent());
dropdownWrapper.find('MenuItem').first().simulate('click');
dropdownWrapper.find('.confirm').simulate('click');
expect(renderedNames(wrapper)).toEqual(['Jack']);
dropdownWrapper.find('.clear').simulate('click');
expect(renderedNames(wrapper)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']);
});
});