From b0f3a552b69950a6e1ec7c62e2ddf964430f58f8 Mon Sep 17 00:00:00 2001 From: afc163 Date: Wed, 15 Jul 2015 14:10:01 +0800 Subject: [PATCH] sort params --- components/table/demo/ajax.md | 9 +++++---- components/table/index.jsx | 36 +++++++++++++++++------------------ 2 files changed, 23 insertions(+), 22 deletions(-) diff --git a/components/table/demo/ajax.md b/components/table/demo/ajax.md index 919dfabb81..80b2498ad7 100644 --- a/components/table/demo/ajax.md +++ b/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; } }; diff --git a/components/table/index.jsx b/components/table/index.jsx index 83b6c85770..af30f6d5cb 100644 --- a/components/table/index.jsx +++ b/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 + }) }); } },