sort params

components/table/demo/ajax.md

@@ -47,17 +47,18 @@ var dataSource = {
   },
   // 和后台接口接收的参数进行适配
   // 参数里提供了分页、筛选、排序的信息
-  getParams: function(pagination, filters, sorters) {
-    console.log(pagination, filters, sorters);
+  getParams: function(pagination, filters, sorter) {
+    console.log(pagination, filters, sorter);
     var params = {
       pageSize: pagination.pageSize,
       currentPage: pagination.current,
-      sort: sorters
+      sortField: sorter.field,
+      sortOrder: sorter.order
     };
     for (let key in filters) {
       params[key] = filters[key];
     }
-    console.log(params);
+    console.log('请求参数：', params);
     return params;
   }
 };

components/table/index.jsx

@@ -38,9 +38,7 @@ let AntTable = React.createClass({
       selectedRowKeys: [],
       loading: false,
       pagination: pagination,
-      data: [],
-      sortColumn: null,
-      sortOrder: null
+      data: []
     };
   },
   getDefaultProps() {
@@ -71,10 +69,6 @@ let AntTable = React.createClass({
         sortColumn.className = 'ant-table-column-sort';
       }
     }
-    this.setState({
-      sortOrder: sortOrder,
-      sortColumn: sortColumn
-    });
     if (this.mode === 'local') {
       let sorter = function() {
         let result = column.sorter.apply(this, arguments);
@@ -90,7 +84,10 @@ let AntTable = React.createClass({
         this.props.dataSource = this.originDataSource.slice();
       }
     }
-    this.fetch();
+    this.setState({
+      sortOrder: sortOrder,
+      sortColumn: sortColumn
+    }, this.fetch);
   },
   handleFilter(column) {
     if (this.mode === 'local') {
@@ -135,8 +132,11 @@ let AntTable = React.createClass({
     }
   },
   handlePageChange: function(current) {
-    this.state.pagination.current = current || 1;
-    this.fetch();
+    let pagination = this.state.pagination;
+    pagination.current = current || 1;
+    this.setState({
+      pagination: pagination
+    }, this.fetch);
   },
   renderSelectionCheckBox(value, record, index) {
     let checked = this.state.selectedRowKeys.indexOf(index + 1) >= 0;
@@ -232,19 +232,20 @@ let AntTable = React.createClass({
     // 准备筛选、排序、分页的参数
     let pagination;
     let filters = {};
-    let sorters = {};
+    let sorter = {};
     pagination = this.state.pagination;
     this.props.columns.forEach(function(column) {
       if (column.dataIndex && column.selectedFilters &&
           column.selectedFilters.length > 0) {
         filters[column.dataIndex] = column.selectedFilters;
       }
-      if (column.dataIndex && column.sorter &&
-          column.sortOrder) {
-        sorters[column.dataIndex] = column.sortOrder;
-      }
     });
-    return [pagination, filters, sorters];
+    if (this.state.sortColumn && this.state.sortOrder &&
+        this.state.sortColumn.dataIndex) {
+      sorter.field = this.state.sortColumn.dataIndex;
+      sorter.order = this.state.sortOrder;
+    }
+    return [pagination, filters, sorter];
   },
   fetch: function() {
     let dataSource = this.props.dataSource;
@@ -285,8 +286,7 @@ let AntTable = React.createClass({
               i < current * pageSize) {
             return item;
           }
-        }),
-        pagination: this.state.pagination
+        })
       });
     }
   },