fix: 综合修改

build/Table.js

@@ -500,28 +500,32 @@ var Table = function (_Component) {
     var currentScrollY = this.props.scroll.y;
     if (prevScrollY && currentScrollY && prevScrollY !== currentScrollY && this.props.lazyLoad && !this.props.ignoreScrollYChange) {
       this.bodyTable.scrollTop = 0;
-    } else if (this.props.ignoreScrollYChange && currentScrollY && prevScrollY && prevScrollY !== currentScrollY) {
+    } else if (this.props.ignoreScrollYChange && currentScrollY && prevScrollY) {
-      var bodyScrollTop = this.bodyTable.scrollTop;
+      if (prevScrollY !== currentScrollY) {
-      if (bodyScrollTop === 0) {
+        var bodyScrollTop = this.bodyTable.scrollTop;
-        // 在顶部的时候，滚动条不用动
+        if (bodyScrollTop === 0) {
-        this.bodyTable.scrollTop = 0;
+          // 在顶部的时候，滚动条不用动
-      } else {
-        var distance = bodyScrollTop + currentScrollY - prevScrollY;
-        if (distance < 0) {
           this.bodyTable.scrollTop = 0;
         } else {
-          var _bodyTable = this.bodyTable,
+          var distance = bodyScrollTop + currentScrollY - prevScrollY;
-              scrollHeight = _bodyTable.scrollHeight,
+          if (distance < 0) {
-              scrollTop = _bodyTable.scrollTop;
+            this.bodyTable.scrollTop = 0;
-
-          var bottomDistance = Math.abs(scrollHeight - scrollTop - prevScrollY); // 在最底部的时候也不用滚动滚动条
-          if (bottomDistance < 5) {
-            // 有些dom计算不是十分精确，设置一个值来缓冲一下
-            this.bodyTable.scrollTop = scrollTop + prevScrollY - currentScrollY;
           } else {
-            this.bodyTable.scrollTop = distance;
+            var _bodyTable = this.bodyTable,
+                scrollHeight = _bodyTable.scrollHeight,
+                scrollTop = _bodyTable.scrollTop;
+
+            var bottomDistance = Math.abs(scrollHeight - scrollTop - prevScrollY); // 在最底部的时候也不用滚动滚动条
+            if (bottomDistance < 5) {
+              // 有些dom计算不是十分精确，设置一个值来缓冲一下
+              this.bodyTable.scrollTop = scrollTop + prevScrollY - currentScrollY;
+            } else {
+              this.bodyTable.scrollTop = distance;
+            }
           }
         }
+      } else {
+        this.bodyTable.scrollTop += 1;
       }
     }
     // 是否传入 scroll中的y属性，如果传入判断是否是整数，如果是则进行比较 。bodyTable 的clientHeight进行判断

build/TableHeader.js

@@ -730,22 +730,22 @@ var _initialiseProps = function _initialiseProps() {
       var diff = event.clientX - _this7.drag.oldLeft;
       var newWidth = _this7.drag.oldWidth + diff;
       _this7.drag.newWidth = newWidth > 0 ? newWidth : _this7.minWidth;
+
+      // displayinrow 判断、 固定行高判断
+      if (!bodyDisplayInRow) {
+        _this7.table.bodyRows.forEach(function (row, index) {
+          var leftRow = _this7.table.fixedLeftBodyRows[index];
+          var rightRow = _this7.table.fixedRightBodyRows[index];
+          if (leftRow || rightRow) {
+            var height = row.getBoundingClientRect().height;
+            leftRow && (leftRow.style.height = height + "px");
+            rightRow && (rightRow.style.height = height + "px");
+          }
+        });
+      }
+
       if (newWidth > _this7.minWidth) {
         currentCols.style.width = newWidth + 'px';
-
-        // displayinrow 判断、 固定行高判断 
-        if (!bodyDisplayInRow) {
-          _this7.table.bodyRows.forEach(function (row, index) {
-            var leftRow = _this7.table.fixedLeftBodyRows[index];
-            var rightRow = _this7.table.fixedRightBodyRows[index];
-            if (leftRow || rightRow) {
-              var height = row.getBoundingClientRect().height;
-              leftRow && (leftRow.style.height = height + "px");
-              rightRow && (rightRow.style.height = height + "px");
-            }
-          });
-        }
-
         //hao 支持固定表头拖拽 修改表体的width
         if (_this7.fixedTable.cols) {
           _this7.fixedTable.cols[_this7.drag.currIndex].style.width = newWidth + "px";

build/lib/dragColumn.js

@@ -126,6 +126,8 @@ function dragColumn(Table) {
     });
 
     DragColumn.prototype.render = function render() {
+      var _this2 = this;
+
       var _props = this.props,
           data = _props.data,
           dragborder = _props.dragborder,
@@ -136,6 +138,9 @@ function dragColumn(Table) {
       return _react2["default"].createElement(Table, _extends({}, others, {
         columns: this.state.columns,
         data: data,
+        ref: function ref(el) {
+          return _this2.table = el;
+        },
         className: className + ' u-table-drag-border',
         onDragEnd: this.onDragEnd,
         draggable: draggable,

dist/demo.js

@@ -48077,6 +48077,7 @@
 	  setRowParentIndex: function setRowParentIndex() {},
 	  tabIndex: '0',
 	  heightConsistent: false,
+	  syncFixedRowHeight: false,
 	  size: 'md',
 	  rowDraggAble: false,
 	  hideDragHandle: false,
@@ -48408,28 +48409,32 @@
 	    var currentScrollY = this.props.scroll.y;
 	    if (prevScrollY && currentScrollY && prevScrollY !== currentScrollY && this.props.lazyLoad && !this.props.ignoreScrollYChange) {
 	      this.bodyTable.scrollTop = 0;
-	    } else if (this.props.ignoreScrollYChange && currentScrollY && prevScrollY && prevScrollY !== currentScrollY) {
+	    } else if (this.props.ignoreScrollYChange && currentScrollY && prevScrollY) {
-	      var bodyScrollTop = this.bodyTable.scrollTop;
+	      if (prevScrollY !== currentScrollY) {
-	      if (bodyScrollTop === 0) {
+	        var bodyScrollTop = this.bodyTable.scrollTop;
-	        // 在顶部的时候，滚动条不用动
+	        if (bodyScrollTop === 0) {
-	        this.bodyTable.scrollTop = 0;
+	          // 在顶部的时候，滚动条不用动
-	      } else {
-	        var distance = bodyScrollTop + currentScrollY - prevScrollY;
-	        if (distance < 0) {
 	          this.bodyTable.scrollTop = 0;
 	        } else {
-	          var _bodyTable = this.bodyTable,
+	          var distance = bodyScrollTop + currentScrollY - prevScrollY;
-	              scrollHeight = _bodyTable.scrollHeight,
+	          if (distance < 0) {
-	              scrollTop = _bodyTable.scrollTop;
+	            this.bodyTable.scrollTop = 0;
-	
-	          var bottomDistance = Math.abs(scrollHeight - scrollTop - prevScrollY); // 在最底部的时候也不用滚动滚动条
-	          if (bottomDistance < 5) {
-	            // 有些dom计算不是十分精确，设置一个值来缓冲一下
-	            this.bodyTable.scrollTop = scrollTop + prevScrollY - currentScrollY;
 	          } else {
-	            this.bodyTable.scrollTop = distance;
+	            var _bodyTable = this.bodyTable,
+	                scrollHeight = _bodyTable.scrollHeight,
+	                scrollTop = _bodyTable.scrollTop;
+	
+	            var bottomDistance = Math.abs(scrollHeight - scrollTop - prevScrollY); // 在最底部的时候也不用滚动滚动条
+	            if (bottomDistance < 5) {
+	              // 有些dom计算不是十分精确，设置一个值来缓冲一下
+	              this.bodyTable.scrollTop = scrollTop + prevScrollY - currentScrollY;
+	            } else {
+	              this.bodyTable.scrollTop = distance;
+	            }
 	          }
 	        }
+	      } else {
+	        this.bodyTable.scrollTop += 1;
 	      }
 	    }
 	    // 是否传入 scroll中的y属性，如果传入判断是否是整数，如果是则进行比较 。bodyTable 的clientHeight进行判断
@@ -49423,7 +49428,8 @@
 	        columns = _props9.columns,
 	        heightConsistent = _props9.heightConsistent,
 	        bodyDisplayInRow = _props9.bodyDisplayInRow,
-	        lazyLoad = _props9.lazyLoad;
+	        lazyLoad = _props9.lazyLoad,
+	        syncFixedRowHeight = _props9.syncFixedRowHeight;
 	
 	    var headRows = this.headTable ? this.headTable.querySelectorAll('thead') : this.bodyTable.querySelectorAll('thead');
 	    var expandedRows = this.bodyTable.querySelectorAll('.' + clsPrefix + '-expanded-row') || [];
@@ -49455,7 +49461,7 @@
 	        }
 	        // 为了提高性能，默认获取主表的高度，但是有的场景中固定列的高度比主表的高度高，所以提供此属性，会统计所有列的高度取最大的，设置
 	        // 内容折行显示，并又设置了 height 的情况下，也要获取主表高度
-	        if (heightConsistent || !bodyDisplayInRow && rsHeight) {
+	        if (heightConsistent || !bodyDisplayInRow && rsHeight && syncFixedRowHeight) {
 	          var leftHeight = void 0,
 	              rightHeight = void 0,
 	              currentHeight = void 0,
@@ -50476,15 +50482,8 @@
 	        // key={hoverKey}
 	        , ref: this.bindElement
 	      },
-	      cells.length > 0 ? cells : isEmptyTr ? _react2['default'].createElement(
+	      cells.length > 0 ? cells : isEmptyTr ? // loading暂时去掉
-	        'td',
+	      _react2['default'].createElement('td', { style: { width: 0, padding: 0 } }) : _react2['default'].createElement('td', { style: { width: 0, padding: 0 } })
-	        { className: 'loading-td ' + (isPre ? 'pre-td' : 'suf-td'), style: { width: tdStyle.width || 1200, height: tdStyle.height || 100 } },
-	        _react2['default'].createElement(
-	          'div',
-	          { style: { left: (containerWidth || 1200) / 2 - 23 }, className: 'loading-div ' + (isPre ? 'pre' : 'suf') },
-	          '\u52A0\u8F7D\u4E2D...'
-	        )
-	      ) : _react2['default'].createElement('td', { style: { width: 0, padding: 0 } })
 	    );
 	  };
 	
@@ -61978,7 +61977,7 @@
 	      table.bodyRows = table.tableBody && table.tableBody.querySelectorAll('tr') || [];
 	
 	      table.fixedLeftHeaderTable = contentTable.querySelector('.u-table-fixed-left .u-table-header');
-	      table.fixedRighHeadertTable = contentTable.querySelector('.u-table-fixed-right .u-table-header');
+	      table.fixedRightHeaderTable = contentTable.querySelector('.u-table-fixed-right .u-table-header');
 	      table.contentTableHeader = contentTable.querySelector('.u-table-scroll .u-table-header');
 	      table.fixedLeftBodyTable = contentTable.querySelectorAll('.u-table-fixed-left .u-table-body-outer');
 	      if (table.fixedLeftBodyTable) {
@@ -61993,6 +61992,10 @@
 	      }
 	
 	      table.innerTableBody = contentTable.querySelector('.u-table-scroll .u-table-body table');
+	      table.fixedLeftHeaderTableBody = table.fixedLeftHeaderTable && table.fixedLeftHeaderTable.querySelector('table') || null;
+	      table.fixedRightHeaderTableBody = table.fixedRightHeaderTable && table.fixedRightHeaderTable.querySelector('table') || null;
+	      table.fixedLeftInnerTableBody = table.fixedLeftBodyTable && table.fixedLeftBodyTable.querySelector('table') || null;
+	      table.fixedRightInnerTableBody = table.fixedRightBodyTable && table.fixedRightBodyTable.querySelector('table') || null;
 	      table.fixedLeftBodyRows = table.fixedLeftBodyTable && table.fixedLeftBodyTable.querySelectorAll('tr') || [];
 	      table.fixedRightBodyRows = table.fixedRightBodyTable && table.fixedRightBodyTable.querySelectorAll('tr') || [];
 	    }
@@ -62088,9 +62091,11 @@
 	
 	    var events = [{ key: 'mouseup', fun: this.onTrMouseUp }, { key: 'mousemove', fun: this.onTrMouseMove }];
 	    // this.eventListen(events,'remove',this.table.tr[0]);
-	    this.doEventList(this.table.tr, function (tr) {
+	    if (this.table && this.table.tr) {
-	      _this5.eventListen(events, 'remove', _this5.table.tr);
+	      this.doEventList(this.table.tr, function (tr) {
-	    });
+	        _this5.eventListen(events, 'remove', _this5.table.tr);
+	      });
+	    }
 	  };
 	
 	  TableHeader.prototype.eventListen = function eventListen(events, type, eventSource) {
@@ -62554,22 +62559,22 @@
 	      var diff = event.clientX - _this7.drag.oldLeft;
 	      var newWidth = _this7.drag.oldWidth + diff;
 	      _this7.drag.newWidth = newWidth > 0 ? newWidth : _this7.minWidth;
+	
+	      // displayinrow 判断、 固定行高判断
+	      if (!bodyDisplayInRow) {
+	        _this7.table.bodyRows.forEach(function (row, index) {
+	          var leftRow = _this7.table.fixedLeftBodyRows[index];
+	          var rightRow = _this7.table.fixedRightBodyRows[index];
+	          if (leftRow || rightRow) {
+	            var height = row.getBoundingClientRect().height;
+	            leftRow && (leftRow.style.height = height + "px");
+	            rightRow && (rightRow.style.height = height + "px");
+	          }
+	        });
+	      }
+	
 	      if (newWidth > _this7.minWidth) {
 	        currentCols.style.width = newWidth + 'px';
-	
-	        // displayinrow 判断、 固定行高判断 
-	        if (!bodyDisplayInRow) {
-	          _this7.table.bodyRows.forEach(function (row, index) {
-	            var leftRow = _this7.table.fixedLeftBodyRows[index];
-	            var rightRow = _this7.table.fixedRightBodyRows[index];
-	            if (leftRow || rightRow) {
-	              var height = row.getBoundingClientRect().height;
-	              leftRow && (leftRow.style.height = height + "px");
-	              rightRow && (rightRow.style.height = height + "px");
-	            }
-	          });
-	        }
-	
 	        //hao 支持固定表头拖拽 修改表体的width
 	        if (_this7.fixedTable.cols) {
 	          _this7.fixedTable.cols[_this7.drag.currIndex].style.width = newWidth + "px";
@@ -62604,12 +62609,12 @@
 	              //找到固定列表格，设置表头的marginBottom值为scrollbarWidth;
 	              _this7.table.contentTableHeader.style.overflowX = 'scroll';
 	              _this7.optTableMargin(_this7.table.fixedLeftHeaderTable, scrollbarWidth);
-	              _this7.optTableMargin(_this7.table.fixedRighHeadertTable, scrollbarWidth);
+	              _this7.optTableMargin(_this7.table.fixedRightHeaderTable, scrollbarWidth);
 	            } else {
 	              //大于 0 不显示滚动条
 	              _this7.table.contentTableHeader.style.overflowX = 'hidden';
 	              _this7.optTableMargin(_this7.table.fixedLeftHeaderTable, 0);
-	              _this7.optTableMargin(_this7.table.fixedRighHeadertTable, 0);
+	              _this7.optTableMargin(_this7.table.fixedRightHeaderTable, 0);
 	            }
 	          } else {
 	            var scrollContainers = _this7.table.tableBody.querySelectorAll('.scroll-container') || [];
@@ -62633,7 +62638,7 @@
 	          }
 	          // console.log('this.drag.contentTableML',this.drag.contentTableML,'diff',diff);
 	          // debugger
-	
+	          _this7.syncFixedBodyTableWidth(); // 同步body中table的宽度
 	          var contentTablePar = _this7.table.contentTableHeader.parentNode;
 	          // left、right缩小的内容，在没有滚动条时，需要将宽度同步到到最后一列
 	          // diff<0 往里拖，
@@ -62676,6 +62681,21 @@
 	    _this7.drag.newWidth && onDraggingBorder && onDraggingBorder(event, _this7.drag.newWidth);
 	  };
 	
+	  this.syncFixedBodyTableWidth = function () {
+	    var _table = _this7.table,
+	        fixedLeftHeaderTableBody = _table.fixedLeftHeaderTableBody,
+	        fixedLeftInnerTableBody = _table.fixedLeftInnerTableBody,
+	        fixedRightHeaderTableBody = _table.fixedRightHeaderTableBody,
+	        fixedRightInnerTableBody = _table.fixedRightInnerTableBody;
+	
+	    if (fixedLeftHeaderTableBody && fixedLeftInnerTableBody) {
+	      fixedLeftInnerTableBody.style.width = fixedLeftHeaderTableBody.getBoundingClientRect().width + 'px';
+	    }
+	    if (fixedRightHeaderTableBody && fixedRightInnerTableBody) {
+	      fixedRightInnerTableBody.style.width = fixedRightHeaderTableBody.getBoundingClientRect().width + 'px';
+	    }
+	  };
+	
 	  this.onTrMouseUp = function (e) {
 	    var event = _utils.Event.getEvent(e);
 	    var width = _this7.drag.newWidth;
@@ -300358,6 +300378,8 @@
 	    });
 	
 	    DragColumn.prototype.render = function render() {
+	      var _this2 = this;
+	
 	      var _props = this.props,
 	          data = _props.data,
 	          dragborder = _props.dragborder,
@@ -300368,6 +300390,9 @@
 	      return _react2['default'].createElement(Table, _extends({}, others, {
 	        columns: this.state.columns,
 	        data: data,
+	        ref: function ref(el) {
+	          return _this2.table = el;
+	        },
 	        className: className + ' u-table-drag-border',
 	        onDragEnd: this.onDragEnd,
 	        draggable: draggable,

package.json

@@ -1,6 +1,6 @@
 {
  "name": "bee-table",
- "version": "2.3.15-beta.21",
+ "version": "2.3.15-beta.22",
  "description": "Table ui component for react",
  "keywords": [
   "react",

src/Table.js

@@ -278,23 +278,27 @@ class Table extends Component {
     const currentScrollY = this.props.scroll.y
     if (prevScrollY && currentScrollY && (prevScrollY !== currentScrollY) && this.props.lazyLoad && !this.props.ignoreScrollYChange) {
       this.bodyTable.scrollTop = 0
-    } else if (this.props.ignoreScrollYChange && currentScrollY && prevScrollY && (prevScrollY !== currentScrollY)) {
+    } else if (this.props.ignoreScrollYChange && currentScrollY && prevScrollY) {
-      const bodyScrollTop = this.bodyTable.scrollTop
+      if (prevScrollY !== currentScrollY) {
-      if (bodyScrollTop === 0) { // 在顶部的时候，滚动条不用动
+        const bodyScrollTop = this.bodyTable.scrollTop
-        this.bodyTable.scrollTop = 0;
+        if (bodyScrollTop === 0) { // 在顶部的时候，滚动条不用动
-      } else {
-        const distance = bodyScrollTop + currentScrollY - prevScrollY;
-        if (distance < 0) {
           this.bodyTable.scrollTop = 0;
         } else {
-          const { scrollHeight, scrollTop } = this.bodyTable
+          const distance = bodyScrollTop + currentScrollY - prevScrollY;
-          const bottomDistance = Math.abs(scrollHeight - scrollTop - prevScrollY) // 在最底部的时候也不用滚动滚动条
+          if (distance < 0) {
-          if (bottomDistance < 5) { // 有些dom计算不是十分精确，设置一个值来缓冲一下
+            this.bodyTable.scrollTop = 0;
-            this.bodyTable.scrollTop = scrollTop + prevScrollY - currentScrollY
           } else {
-            this.bodyTable.scrollTop = distance;
+            const { scrollHeight, scrollTop } = this.bodyTable
+            const bottomDistance = Math.abs(scrollHeight - scrollTop - prevScrollY) // 在最底部的时候也不用滚动滚动条
+            if (bottomDistance < 5) { // 有些dom计算不是十分精确，设置一个值来缓冲一下
+              this.bodyTable.scrollTop = scrollTop + prevScrollY - currentScrollY
+            } else {
+              this.bodyTable.scrollTop = distance;
+            }
           }
         }
+      } else {
+        this.bodyTable.scrollTop += 1
       }
     }
     // 是否传入 scroll中的y属性，如果传入判断是否是整数，如果是则进行比较 。bodyTable 的clientHeight进行判断

src/TableHeader.js

@@ -377,22 +377,22 @@ class TableHeader extends Component {
       let diff = (event.clientX - this.drag.oldLeft);
       let newWidth = this.drag.oldWidth + diff;
       this.drag.newWidth = newWidth > 0 ? newWidth : this.minWidth;
+
+      // displayinrow 判断、 固定行高判断
+      if(!bodyDisplayInRow) {
+        this.table.bodyRows.forEach((row,index)=>{
+          const leftRow = this.table.fixedLeftBodyRows[index];
+          const rightRow = this.table.fixedRightBodyRows[index];
+          if(leftRow || rightRow) {
+            const height = row.getBoundingClientRect().height;
+            leftRow && (leftRow.style.height = height + "px")
+            rightRow && (rightRow.style.height = height + "px")
+          }
+        })
+      }
+
       if(newWidth > this.minWidth){
         currentCols.style.width = newWidth +'px';
-        
-        // displayinrow 判断、 固定行高判断 
-        if(!bodyDisplayInRow) {
-          this.table.bodyRows.forEach((row,index)=>{
-            const leftRow = this.table.fixedLeftBodyRows[index];
-            const rightRow = this.table.fixedRightBodyRows[index];
-            if(leftRow || rightRow) {
-              const height = row.getBoundingClientRect().height;
-              leftRow && (leftRow.style.height = height + "px")
-              rightRow && (rightRow.style.height = height + "px")
-            }
-          })
-        }
-
         //hao 支持固定表头拖拽 修改表体的width
         if(this.fixedTable.cols){
             this.fixedTable.cols[this.drag.currIndex].style.width = newWidth + "px";

src/lib/dragColumn.js

@@ -90,6 +90,7 @@ export default function dragColumn(Table) {
               {...others}
               columns={this.state.columns}
               data={data}
+              ref={el => this.table = el}
               className={`${className} u-table-drag-border`}
               onDragEnd={this.onDragEnd}
               draggable={draggable}