1,效果图如下 

 2,代码如下
@Form.create() class StudentsList extends PureComponent { state = { eAdd:"",
eEdit:"", eDestroy:"", filteredInfo: null, sortedInfo: null, pageQuery:'', };
// 排序开始 handleChange = (pagination, filters, sorter,) => { console.log('Various
parameters', sorter); const { dispatch, form } = this.props; const query =
this.props.query; const pageQuery=this.state.pageQuery; const
sortVlaue=sorter.field; form.validateFields((err) => { if (!err) {
if(sorter.order=="ascend"){ dispatch({ type: 'students/fetch', payload: { sort:
sortVlaue , order: "ASC" ,query,name:pageQuery} }); this.setState({
filteredInfo: filters, sortedInfo: sorter, }); } else if
(sorter.order=="descend"){ dispatch({ type: 'students/fetch', payload: { sort:
sortVlaue , order: "DESC" ,query,name:pageQuery} }); this.setState({
filteredInfo: filters, sortedInfo: sorter, }); }else { dispatch({ type:
'students/fetch', payload: { sort: sortVlaue , order: "ASC"
,query,name:pageQuery} }); this.setState({ filteredInfo: filters, sortedInfo:
sorter, }); } } }) }; clearFilters = () => { this.setState({ filteredInfo: null
}); }; clearAll = () => { this.setState({ filteredInfo: null, sortedInfo: null,
}); }; // 排序结束 } render() { let { sortedInfo, filteredInfo } = this.state;
sortedInfo = sortedInfo || {}; filteredInfo = filteredInfo || {}; const columns
= [ { title: '学员编号', dataIndex: 'code', key: 'code', onFilter: (value, record)
=> record.code.includes(value), sorter: (a, b) => a.code.length -
b.code.length, sortOrder: sortedInfo.columnKey === 'code' && sortedInfo.order,
align: 'center', }, ]; return ( <Table columns={columns}
dataSource={studentsList} rowKey={record => record.id} pagination={false}
rowSelection={rowSelection} onChange={this.handleChange} /> ) } } function
mapStateToProps(state) { return { ...state.students }; } export default
connect(mapStateToProps)(StudentsList);
 

技术
©2020 ioDraw All rights reserved
2020前端学习路线收集整理【C语言】乘法表29岁“退休程序员”郭宇: 有钱的人不一定自由,自由的人不一定有钱python gui界面实例-Python GUI编程完整示例pytorch训练过程中GPU利用率低学习java 的第一节课vue element-ui实现input输入框金额数字添加千分位对于面试官的问答: 你在项目组里拿到一个项目是怎么开展的呢???算法题的输入大总结小程序表单中 多个循环input 如何取每个input的值