解决switch拖拽，拖拽改成插入

build/Table.js

@@ -230,7 +230,16 @@ var Table = function (_Component) {
     };
 
     _this.swapArray = function (arr, index1, index2) {
-      arr[index1] = arr.splice(index2, 1, arr[index1])[0];
+      var value1 = arr[index1];
+      arr.splice(index1, 1);
+      if (index1 < index2) {
+        console.log('向下拖');
+        arr.splice(index2, 0, value1);
+      } else {
+        console.log('向上拖');
+        arr.splice(index2 + 1, 0, value1);
+      }
+      // arr[index1] = arr.splice(index2, 1, arr[index1])[0];
       return arr;
     };
 

build/TableRow.js

@@ -165,6 +165,10 @@ var TableRow = function (_Component) {
       var event = _utils.Event.getEvent(e),
           _target = _utils.Event.getTarget(event),
           target = _target.parentNode;
+
+      while (target.tagName != 'TR') {
+        target = target.parentNode;
+      }
       _this.currentIndex = target.getAttribute("data-row-key");
 
       onDragRowStart && onDragRowStart(_this.currentIndex);

build/lib/dragColumn.js

@@ -1,7 +1,7 @@
 'use strict';
 
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
 });
 
 var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
@@ -35,126 +35,126 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
 
 function dragColumn(Table) {
 
-  return function (_Component) {
+    return function (_Component) {
-    _inherits(DragColumn, _Component);
+        _inherits(DragColumn, _Component);
 
-    function DragColumn(props) {
+        function DragColumn(props) {
-      _classCallCheck(this, DragColumn);
+            _classCallCheck(this, DragColumn);
 
-      var _this = _possibleConstructorReturn(this, _Component.call(this, props));
+            var _this = _possibleConstructorReturn(this, _Component.call(this, props));
 
-      _this.setColumOrderByIndex = function (_column) {
+            _this.setColumOrderByIndex = function (_column) {
-        _column.forEach(function (da, i) {
+                _column.forEach(function (da, i) {
-          da.dragIndex = i;
+                    da.dragIndex = i;
-          da.drgHover = false;
+                    da.drgHover = false;
-        });
+                });
-        return _column;
+                return _column;
-      };
+            };
 
-      _this.onDrop = function (event, data) {
+            _this.onDrop = function (event, data) {
-        var dragSource = data.dragSource,
+                var dragSource = data.dragSource,
-            dragTarg = data.dragTarg;
+                    dragTarg = data.dragTarg;
-        var columns = _this.state.columns;
+                var columns = _this.state.columns;
 
-        var sourceIndex = -1,
+                var sourceIndex = -1,
-            targetIndex = -1;
+                    targetIndex = -1;
 
-        sourceIndex = columns.findIndex(function (da, i) {
+                sourceIndex = columns.findIndex(function (da, i) {
-          return da.key == dragSource.key;
+                    return da.key == dragSource.key;
-        });
+                });
-        targetIndex = columns.findIndex(function (da, i) {
+                targetIndex = columns.findIndex(function (da, i) {
-          return da.key == dragTarg.key;
+                    return da.key == dragTarg.key;
-        });
+                });
-        // 向前移动
+                // 向前移动
-        if (targetIndex < sourceIndex) {
+                if (targetIndex < sourceIndex) {
-          targetIndex = targetIndex + 1;
+                    targetIndex = targetIndex + 1;
+                }
+                columns.splice(targetIndex, 0, columns.splice(sourceIndex, 1)[0]);
+                var _newColumns = [];
+                columns.forEach(function (da, i) {
+                    var newDate = _extends(da, {});
+                    newDate.title = da.title;
+                    _newColumns.push(newDate);
+                });
+                // console.log(" onDrop-------columns--- ",columns);
+                _this.setState({
+                    columns: _newColumns //cloneDeep(columns)
+                });
+                // console.log(" onDrop-------columns--- ",_newColumns);
+                // console.log(columns === _newColumns);
+                if (_this.props.onDrop) {
+                    _this.props.onDrop(event, data, columns);
+                }
+            };
+
+            _this.getTarget = function (evt) {
+                return evt.target || evt.srcElement;
+            };
+
+            _this.state = {
+                columns: _this.setColumOrderByIndex(props.columns)
+            };
+            return _this;
         }
-        columns.splice(targetIndex, 0, columns.splice(sourceIndex, 1)[0]);
+
-        var _newColumns = [];
+        DragColumn.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
-        columns.forEach(function (da, i) {
+            if (nextProps.columns != this.props.columns) {
-          var newDate = _extends(da, {});
+                this.setState({
-          newDate.title = da.title;
+                    columns: this.setColumOrderByIndex(nextProps.columns)
-          _newColumns.push(newDate);
+                });
+            }
+        };
+
+        DragColumn.prototype.recursion = function (_recursion) {
+            function recursion(_x) {
+                return _recursion.apply(this, arguments);
+            }
+
+            recursion.toString = function () {
+                return _recursion.toString();
+            };
+
+            return recursion;
+        }(function (obj) {
+            var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+
+            for (key in obj) {
+                if (_typeof(obj[key]) == 'object' && Object.keys(obj[key].length > 0)) {
+                    data[key] = recursion(obj[key]);
+                } else {
+                    data[key] = obj[key];
+                }
+            }
+            return data;
         });
-        // console.log(" onDrop-------columns--- ",columns);
-        _this.setState({
-          columns: _newColumns //cloneDeep(columns)
-        });
-        // console.log(" onDrop-------columns--- ",_newColumns);
-        // console.log(columns === _newColumns);
-        if (_this.props.onDrop) {
-          _this.props.onDrop(event, data, columns);
-        }
-      };
 
-      _this.getTarget = function (evt) {
+        DragColumn.prototype.render = function render() {
-        return evt.target || evt.srcElement;
+            var _props = this.props,
-      };
+                data = _props.data,
+                dragborder = _props.dragborder,
+                draggable = _props.draggable,
+                className = _props.className,
+                columns = _props.columns,
+                onDragStart = _props.onDragStart,
+                onDragEnter = _props.onDragEnter,
+                onDragOver = _props.onDragOver,
+                onDrop = _props.onDrop,
+                others = _objectWithoutProperties(_props, ['data', 'dragborder', 'draggable', 'className', 'columns', 'onDragStart', 'onDragEnter', 'onDragOver', 'onDrop']);
 
-      _this.state = {
+            return _react2["default"].createElement(Table, _extends({}, others, {
-        columns: _this.setColumOrderByIndex(props.columns)
+                columns: this.state.columns,
-      };
+                data: data,
-      return _this;
+                className: className + ' u-table-drag-border',
-    }
+                onDragStart: this.onDragStart,
+                onDragOver: this.onDragOver,
+                onDrop: this.onDrop,
+                onDragEnter: this.onDragEnter,
+                draggable: draggable,
+                dragborder: dragborder
+            }));
+        };
 
-    DragColumn.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
+        return DragColumn;
-      if (nextProps.columns != this.props.columns) {
+    }(_react.Component);
-        this.setState({
-          columns: this.setColumOrderByIndex(nextProps.columns)
-        });
-      }
-    };
-
-    DragColumn.prototype.recursion = function (_recursion) {
-      function recursion(_x) {
-        return _recursion.apply(this, arguments);
-      }
-
-      recursion.toString = function () {
-        return _recursion.toString();
-      };
-
-      return recursion;
-    }(function (obj) {
-      var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-
-      for (key in obj) {
-        if (_typeof(obj[key]) == 'object' && Object.keys(obj[key].length > 0)) {
-          data[key] = recursion(obj[key]);
-        } else {
-          data[key] = obj[key];
-        }
-      }
-      return data;
-    });
-
-    DragColumn.prototype.render = function render() {
-      var _props = this.props,
-          data = _props.data,
-          dragborder = _props.dragborder,
-          draggable = _props.draggable,
-          className = _props.className,
-          columns = _props.columns,
-          onDragStart = _props.onDragStart,
-          onDragEnter = _props.onDragEnter,
-          onDragOver = _props.onDragOver,
-          onDrop = _props.onDrop,
-          others = _objectWithoutProperties(_props, ['data', 'dragborder', 'draggable', 'className', 'columns', 'onDragStart', 'onDragEnter', 'onDragOver', 'onDrop']);
-
-      return _react2["default"].createElement(Table, _extends({}, others, {
-        columns: this.state.columns,
-        data: data,
-        className: className + ' u-table-drag-border',
-        onDragStart: this.onDragStart,
-        onDragOver: this.onDragOver,
-        onDrop: this.onDrop,
-        onDragEnter: this.onDragEnter,
-        draggable: draggable,
-        dragborder: dragborder
-      }));
-    };
-
-    return DragColumn;
-  }(_react.Component);
 }
 module.exports = exports['default'];

build/lib/util.js

@@ -1,7 +1,7 @@
 'use strict';
 
 Object.defineProperty(exports, "__esModule", {
-    value: true
+  value: true
 });
 
 var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
@@ -20,29 +20,29 @@ exports.ObjectAssign = ObjectAssign;
 */
 
 function sortBy(arr, prop, desc) {
-    var props = [],
+  var props = [],
-        ret = [],
+      ret = [],
-        i = 0,
+      i = 0,
-        len = arr.length;
+      len = arr.length;
-    if (typeof prop == 'string') {
+  if (typeof prop == 'string') {
-        for (; i < len; i++) {
+    for (; i < len; i++) {
-            var oI = arr[i];
+      var oI = arr[i];
-            (props[i] = new String(oI && oI[prop] || ''))._obj = oI;
+      (props[i] = new String(oI && oI[prop] || ''))._obj = oI;
-        }
-    } else if (typeof prop == 'function') {
-        for (; i < len; i++) {
-            var _oI = arr[i];
-            (props[i] = new String(_oI && prop(_oI) || ''))._obj = _oI;
-        }
-    } else {
-        throw '参数类型错误';
     }
-    props.sort();
+  } else if (typeof prop == 'function') {
-    for (i = 0; i < len; i++) {
+    for (; i < len; i++) {
-        ret[i] = props[i]._obj;
+      var _oI = arr[i];
+      (props[i] = new String(_oI && prop(_oI) || ''))._obj = _oI;
     }
-    if (desc) ret.reverse();
+  } else {
-    return ret;
+    throw '参数类型错误';
+  }
+  props.sort();
+  for (i = 0; i < len; i++) {
+    ret[i] = props[i]._obj;
+  }
+  if (desc) ret.reverse();
+  return ret;
 };
 
 /**
@@ -51,11 +51,11 @@ function sortBy(arr, prop, desc) {
  * @param {} property 
  */
 function compare(property) {
-    return function (a, b) {
+  return function (a, b) {
-        var value1 = a[property];
+    var value1 = a[property];
-        var value2 = b[property];
+    var value2 = b[property];
-        return value1 - value2;
+    return value1 - value2;
-    };
+  };
 }
 
 /**
@@ -63,17 +63,17 @@ function compare(property) {
  * @param {*} obj 要拷贝的对象 
  */
 function ObjectAssign(obj) {
-    var b = obj instanceof Array;
+  var b = obj instanceof Array;
-    var tagObj = b ? [] : {};
+  var tagObj = b ? [] : {};
-    if (b) {
+  if (b) {
-        //数组
+    //数组
-        obj.forEach(function (da) {
+    obj.forEach(function (da) {
-            var _da = {};
+      var _da = {};
-            _extends(_da, da);
+      _extends(_da, da);
-            tagObj.push(_da);
+      tagObj.push(_da);
-        });
+    });
-    } else {
+  } else {
-        _extends(tagObj, obj);
+    _extends(tagObj, obj);
-    }
+  }
-    return tagObj;
+  return tagObj;
 }

src/Table.js

@@ -617,7 +617,17 @@ class Table extends Component {
   * @param {number} index2 删除项目的位置
   */
   swapArray = (arr, index1, index2) => {
-    arr[index1] = arr.splice(index2, 1, arr[index1])[0];
+    var value1 = arr[index1]
+    arr.splice(index1,1)
+    if(index1<index2){
+      console.log('向下拖')
+      arr.splice(index2,0,value1)
+
+    }else {
+      console.log('向上拖')
+      arr.splice(index2+1,0,value1)
+    }
+ 
      return arr;
   }
 

src/TableRow.js

@@ -198,6 +198,10 @@ class TableRow extends Component{
     let event = Event.getEvent(e) ,
         _target = Event.getTarget(event),
         target = _target.parentNode;
+    
+    while (target.tagName != 'TR') {
+      target = target.parentNode
+    }
     this.currentIndex = target.getAttribute("data-row-key");
     
     onDragRowStart && onDragRowStart(this.currentIndex);