diff --git a/build/Table.js b/build/Table.js index 5433db8..3b70074 100644 --- a/build/Table.js +++ b/build/Table.js @@ -351,6 +351,7 @@ var Table = function (_Component) { _this.columnManager = new _ColumnManager2["default"](props.columns, props.children, props.originWidth, showDragHandle, props.showRowNum); // 加入props.showRowNum参数 _this.store = (0, _createStore2["default"])({ currentHoverKey: null }); _this.firstDid = true; + _this.scrollYChanged = false; if (props.defaultExpandAllRows) { for (var i = 0; i < rows.length; i++) { var row = rows[i]; @@ -515,6 +516,7 @@ var Table = function (_Component) { this.bodyTable.scrollTop = 0; } else if (this.props.ignoreScrollYChange && currentScrollY && prevScrollY) { if (prevScrollY !== currentScrollY) { + this.scrollYChanged = true; var bodyScrollTop = this.bodyTable.scrollTop; if (bodyScrollTop === 0) { // 在顶部的时候,滚动条不用动 @@ -537,8 +539,9 @@ var Table = function (_Component) { } } } - } else { + } else if (this.scrollYChanged) { this.bodyTable.scrollTop += 1; + this.scrollYChanged = false; } } // 是否传入 scroll中的y属性,如果传入判断是否是整数,如果是则进行比较 。bodyTable 的clientHeight进行判断 @@ -1731,12 +1734,15 @@ var Table = function (_Component) { var _props11 = this.props, syncHover = _props11.syncHover, onRowHover = _props11.onRowHover, - data = _props11.data; + data = _props11.data, + lazyLoad = _props11.lazyLoad; //fix:树形表,onRowHover返回参数异常 var isTreeType = this.isTreeType; - var record = isTreeType ? propsRecord : data[currentIndex]; + var record = isTreeType ? propsRecord : lazyLoad ? data.find(function (item) { + return item.originIndex === currentIndex; + }) : data[currentIndex]; // 固定列、或者含有hoverdom时情况下同步hover状态 if (this.columnManager.isAnyColumnsFixed() && syncHover) { this.hoverKey = key; @@ -1820,7 +1826,6 @@ var Table = function (_Component) { if (hasFixedLeft) { className += ' has-fixed-left'; } - return _react2["default"].createElement( 'div', { className: className, style: props.style, ref: function ref(el) { @@ -1858,7 +1863,7 @@ var Table = function (_Component) { onMouseEnter: this.onRowHoverMouseEnter, onMouseLeave: this.onRowHoverMouseLeave, ref: function ref(el) { return _this7.hoverDom = el; } }, - props.hoverContent(currentHoverRecord, currentHoverIndex) + currentHoverRecord ? props.hoverContent(currentHoverRecord, currentHoverIndex) : null ) ); }; diff --git a/build/lib/bigData.js b/build/lib/bigData.js index d8b6e9c..f54e0c2 100644 --- a/build/lib/bigData.js +++ b/build/lib/bigData.js @@ -77,9 +77,9 @@ function bigData(Table) { BigData.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) { var props = this.props; var currentIndex = nextProps.currentIndex, - newData = nextProps.data, newExpandedKeys = nextProps.expandedRowKeys; + var newData = this.modifyNewData(nextProps.data); var _this = this, dataLen = newData.length; if (nextProps.scroll.y !== props.scroll.y) { @@ -387,6 +387,14 @@ function bigData(Table) { }, _initialiseProps = function _initialiseProps() { var _this5 = this; + this.modifyNewData = function (data) { + if (!data && !data.length) return data; + return data.map(function (item, index) { + item.originIndex = index; + return item; + }); + }; + this.getTreeData = function (expandedKeys, newData) { var startIndex = _this5.startIndex, endIndex = _this5.endIndex; diff --git a/package.json b/package.json index 0351158..a544406 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "bee-table", - "version": "2.3.15-beta.25", + "version": "2.3.15-beta.26", "description": "Table ui component for react", "keywords": [ "react", diff --git a/src/Table.js b/src/Table.js index 2aa7f70..e48be42 100644 --- a/src/Table.js +++ b/src/Table.js @@ -128,6 +128,7 @@ class Table extends Component { this.columnManager = new ColumnManager(props.columns, props.children, props.originWidth, showDragHandle, props.showRowNum); // 加入props.showRowNum参数 this.store = createStore({ currentHoverKey: null }); this.firstDid = true; + this.scrollYChanged = false; if (props.defaultExpandAllRows) { for (let i = 0; i < rows.length; i++) { const row = rows[i]; @@ -286,6 +287,7 @@ class Table extends Component { this.bodyTable.scrollTop = 0 } else if (this.props.ignoreScrollYChange && currentScrollY && prevScrollY) { if (prevScrollY !== currentScrollY) { + this.scrollYChanged = true const bodyScrollTop = this.bodyTable.scrollTop if (bodyScrollTop === 0) { // 在顶部的时候,滚动条不用动 this.bodyTable.scrollTop = 0; @@ -303,8 +305,9 @@ class Table extends Component { } } } - } else { + } else if (this.scrollYChanged) { this.bodyTable.scrollTop += 1 + this.scrollYChanged = false } } // 是否传入 scroll中的y属性,如果传入判断是否是整数,如果是则进行比较 。bodyTable 的clientHeight进行判断 @@ -1490,10 +1493,10 @@ class Table extends Component { handleRowHover(isHover, key,event,currentIndex, propsRecord) { //增加新的API,设置是否同步Hover状态,提高性能,避免无关的渲染 - let { syncHover,onRowHover,data } = this.props; + let { syncHover,onRowHover,data, lazyLoad } = this.props; //fix:树形表,onRowHover返回参数异常 let { isTreeType } = this; - const record = isTreeType ? propsRecord : data[currentIndex]; + const record = isTreeType ? propsRecord : lazyLoad ? data.find(item => item.originIndex === currentIndex) : data[currentIndex]; // 固定列、或者含有hoverdom时情况下同步hover状态 if(this.columnManager.isAnyColumnsFixed() && syncHover ){ this.hoverKey = key; @@ -1604,7 +1607,6 @@ class Table extends Component { if(hasFixedLeft){ className += ` has-fixed-left`; } - return (
this.contentTable = el} tabIndex={props.focusable && (props.tabIndex?props.tabIndex:'0')} > @@ -1630,7 +1632,7 @@ class Table extends Component { container={this} {...loading} /> { props.hoverContent &&
this.hoverDom = el }>{props.hoverContent(currentHoverRecord, currentHoverIndex)}
} + onMouseEnter={this.onRowHoverMouseEnter} onMouseLeave={this.onRowHoverMouseLeave} ref={el=> this.hoverDom = el }>{currentHoverRecord ? props.hoverContent(currentHoverRecord, currentHoverIndex) : null}
} ); } diff --git a/src/lib/bigData.js b/src/lib/bigData.js index 9394507..1b84152 100644 --- a/src/lib/bigData.js +++ b/src/lib/bigData.js @@ -50,7 +50,8 @@ export default function bigData(Table) { } componentWillReceiveProps(nextProps) { const props = this.props; - const {currentIndex ,data:newData, expandedRowKeys:newExpandedKeys} = nextProps; + const {currentIndex, expandedRowKeys:newExpandedKeys} = nextProps; + const newData = this.modifyNewData(nextProps.data) const _this = this,dataLen = newData.length; if (nextProps.scroll.y !== props.scroll.y) { const rowHeight = nextProps.height ? nextProps.height : defaultHeight; @@ -107,6 +108,14 @@ export default function bigData(Table) { } } + modifyNewData = data => { + if (!data && !data.length) return data + return data.map((item, index) => { + item.originIndex = index + return item + }) + } + /** * 如果是树形表,需要对传入的 data 进行处理 * @param expandedKeys: nextProps 中传入的新 expandedRowKeys 属性值