在cloum 上增加order属性，进行排序

README.md

@@ -109,6 +109,7 @@ class Demo extends Component {
 |render|cell的render函数有三个参数：这个单元格的文本，这行的记录，这行的索引，它返回一个对象：{children：value，props：{colSpan：1，rowSpan：1}} ==>'children'是这个单元格的文本，props是这个单元格的一些设置|-|
 |onCellClick|单击列的单元格时调用|Function(row, event)|-|
 |onHeadCellClick|单击表头的单元格时调用|Function(row, event)|row 当前行的数据|
+| order | 设置排序 | string（"descend"、"ascend"） | -|
 
 
 

demo/demolist/Demo13.js

@@ -22,16 +22,24 @@ const columns13 = [
     width: 200
   },
   {
-    title: "性别",
+    title: "功力指数",
     dataIndex: "b",
     key: "b",
-    width: 200
+    width: 200,
+    sumCol: true,
+    order:"ascend",
+    sorter: (a, b) => a.c - b.c,
+    sorterClick:(data,type)=>{//排序的回调函数
+      //type value is up or down
+      console.log("data",data);
+    }
   },
   {
     title: "年龄",
     dataIndex: "c",
     key: "c",
     width: 200,
+    order:"descend",
     sumCol: true,
     sorter: (a, b) => a.c - b.c,
     sorterClick:(data,type)=>{//排序的回调函数
@@ -48,9 +56,9 @@ const columns13 = [
 ];
 
 const data13 = [
-  { a: "杨过", b: "男", c: 30, d: "内行", key: "2" },
-  { a: "令狐冲", b: "男", c: 41, d: "大侠", key: "1" },
-  { a: "郭靖", b: "男", c: 25, d: "大侠", key: "3" }
+  { a: "杨过", b: 675, c: 30, d: "内行", key: "2" },
+  { a: "令狐冲", b: 43, c: 41, d: "大侠", key: "1" },
+  { a: "郭靖", b: 153, c: 25, d: "大侠", key: "3" }
 ];
 const data13_1 = [
   { a: "杨过", b: "男", c: 30, d: "内行", key: "2" },

docs/api.md

@@ -67,7 +67,7 @@ import 'bee-table/build/Table.css';
 |fixed|	当表水平滚动时，此列将被固定：true或'left'或'right'| true/'left'/'right'|-|
 |render|cell的render函数有三个参数：这个单元格的文本，这行的记录，这行的索引，它返回一个对象：{children：value，props：{colSpan：1，rowSpan：1}} ==>'children'是这个单元格的文本，props是这个单元格的一些设置，可以设置单元格行/列合并|-|
 |onCellClick|单击列的单元格时调用|Function(row, event)|-|
-
+| order | 设置排序 | string（"descend"、"ascend"） | -|
 
 {% include "mixin.md"%}
 

src/lib/sort.js

@@ -10,21 +10,25 @@ export default function sort(Table, Icon) {
     constructor(props) {
       super(props);
       this.state = {
-        sortOrder: "",
-        data: this.props.data
+        data: this.props.data,
+        columns:props.columns, 
       };
     }
     componentWillReceiveProps(nextProps){
       if(nextProps.data !== this.props.data){
         this.setState({ 
-          sortOrder: "",
           data: nextProps.data,
           oldData: nextProps.data.concat(),
         });
       }
+      if(nextProps.columns !== this.props.columns){
+        this.setState({
+          columns: nextProps.columns, 
+        });
+      }
     }
     toggleSortOrder = (order, column) => {
-      let { sortOrder, data, oldData } = this.state;
+      let { data, oldData ,columns} = this.state;
       let ascend_sort = function(key) {
         return function(a, b) {
           return a.key - b.key;
@@ -35,10 +39,10 @@ export default function sort(Table, Icon) {
           return b.key - a.key;
         };
       };
-      if (sortOrder === order) {
-        // 切换为未排序状态
-        order = "";
-      }
+      // if (sortOrder === order) {
+      //   // 切换为未排序状态
+      //   order = "";
+      // }
       if (!oldData) {
         oldData = data.concat();
       }
@@ -53,21 +57,22 @@ export default function sort(Table, Icon) {
       } else {
         data = oldData.concat();
       }
+      let seleObj = columns.find(da=>da.key == column.key);
+      seleObj.order = order;
       this.setState({ 
-        sortOrder: order,
-        data: data,
-        oldData: oldData
+        data,
+        oldData,
+        columns
       });
     };
-    renderColumnsDropdown(columns) {
-      const { sortOrder } = this.state;
+    renderColumnsDropdown=(columns)=>{
       const prefixCls = this.props.prefixCls || "bee-table";
       return columns.map(originColumn => {
         let column = Object.assign({}, originColumn);
         let sortButton;
         if (column.sorter) {
-          const isAscend = sortOrder === "ascend";
-          const isDescend = sortOrder === "descend";
+          let isAscend = column.order && column.order === "ascend";
+          let isDescend = column.order && column.order === "descend";
           sortButton = (
             <div className={`${prefixCls}-column-sorter`}>
               <span
@@ -77,6 +82,7 @@ export default function sort(Table, Icon) {
                 title="↑"
                 onClick={() =>{ 
                   this.toggleSortOrder("ascend", column);
+
                   if(column.sorterClick){
                     column.sorterClick(column,"up");
                   }
@@ -111,7 +117,7 @@ export default function sort(Table, Icon) {
       });
     }
     render() {
-      let columns = this.renderColumnsDropdown(this.props.columns.concat());
+      let columns = this.renderColumnsDropdown(this.state.columns.concat());
       return <Table {...this.props} columns={columns} data={this.state.data} />;
     }
   };