test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-12-01 03:29:39 +08:00
Code Issues Actions 69 Packages Projects Releases Wiki Activity

Fix table filter in JSX (#4765)

Browse Source 
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
components/table/Table.tsx
View File

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

42
components/table/__tests__/Table.filter.test.js
View File

@ -194,4 +194,46 @@ describe('Table.filter', () => {
dropdownWrapper.find('.confirm').simulate('click'); dropdownWrapper.find('.confirm').simulate('click');
expect(renderedNames(wrapper)).toEqual(['Jack']); 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']);
});
}); });