fix:滚动场景中的表格合并
This commit is contained in:
parent
5801386bee
commit
52b794d579
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -635,6 +635,7 @@ class Table extends Component {
|
|||
}
|
||||
const lazyCurrentIndex = props.lazyLoad && props.lazyLoad.startIndex ?props.lazyLoad.startIndex :0;
|
||||
const lazyParentIndex = props.lazyLoad && props.lazyLoad.startParentIndex ?props.lazyLoad.startParentIndex :0;
|
||||
const lazyEndIndex = props.lazyLoad && props.lazyLoad.endIndex ?props.lazyLoad.endIndex :-1;
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
let isHiddenExpandIcon;
|
||||
const record = data[i];
|
||||
|
@ -738,6 +739,8 @@ class Table extends Component {
|
|||
tableUid = {this.tableUid}
|
||||
expandedIcon={props.expandedIcon}
|
||||
collapsedIcon={props.collapsedIcon}
|
||||
lazyStartIndex = {lazyCurrentIndex}
|
||||
lazyEndIndex = {lazyEndIndex}
|
||||
/>
|
||||
);
|
||||
this.treeRowIndex++;
|
||||
|
|
|
@ -30,7 +30,7 @@ class TableCell extends Component{
|
|||
}
|
||||
render() {
|
||||
const { record, indentSize, clsPrefix, indent,
|
||||
index, expandIcon, column ,fixed,showSum, bodyDisplayInRow} = this.props;
|
||||
index, expandIcon, column ,fixed,showSum, bodyDisplayInRow,lazyStartIndex,lazyEndIndex} = this.props;
|
||||
const { dataIndex, render } = column;
|
||||
let {className = ''} = column;
|
||||
|
||||
|
@ -43,9 +43,10 @@ class TableCell extends Component{
|
|||
text = render(text, record, index);
|
||||
if (this.isInvalidRenderCellText(text)) {
|
||||
tdProps = text.props || {};
|
||||
rowSpan = tdProps.rowSpan;
|
||||
rowSpan = (tdProps.rowSpan>lazyEndIndex && lazyEndIndex>5)?lazyEndIndex-index:tdProps.rowSpan;
|
||||
colSpan = tdProps.colSpan;
|
||||
text = text.children;
|
||||
console.log("rowIndex====",index,"rowSpan=======",rowSpan,lazyEndIndex);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -61,9 +62,13 @@ class TableCell extends Component{
|
|||
/>
|
||||
) : null;
|
||||
|
||||
if (rowSpan === 0 || colSpan === 0) {
|
||||
if ((lazyStartIndex !==index) &&(rowSpan === 0 || colSpan === 0) ) {
|
||||
return null;
|
||||
}
|
||||
if(tdProps && tdProps.mergeEndIndex && index<tdProps.mergeEndIndex && rowSpan === 0){
|
||||
rowSpan = tdProps.mergeEndIndex - index;
|
||||
text = ''
|
||||
}
|
||||
//不是固定表格并且当前列是固定,则隐藏当前列
|
||||
if(column.fixed && !fixed){
|
||||
className = className+` ${clsPrefix}-fixed-columns-in-body`;
|
||||
|
@ -80,7 +85,8 @@ class TableCell extends Component{
|
|||
rowSpan={rowSpan}
|
||||
className={className}
|
||||
onClick={this.handleClick}
|
||||
title = {title}
|
||||
title={title}
|
||||
|
||||
>
|
||||
{indentText}
|
||||
{expandIcon}
|
||||
|
|
|
@ -418,7 +418,7 @@ class TableRow extends Component{
|
|||
clsPrefix, columns, record, height, visible, index,
|
||||
expandIconColumnIndex, expandIconAsCell, expanded, expandRowByClick,rowDraggAble,
|
||||
expandable, onExpand, needIndentSpaced, indent, indentSize,isHiddenExpandIcon,fixed,bodyDisplayInRow
|
||||
,expandedIcon,collapsedIcon, hoverKey
|
||||
,expandedIcon,collapsedIcon, hoverKey,lazyStartIndex,lazyEndIndex
|
||||
} = this.props;
|
||||
let showSum = false;
|
||||
let { className } = this.props;
|
||||
|
@ -471,6 +471,8 @@ class TableRow extends Component{
|
|||
showSum={showSum}
|
||||
expandIcon={(isColumnHaveExpandIcon) ? expandIcon : null}
|
||||
bodyDisplayInRow = {bodyDisplayInRow}
|
||||
lazyStartIndex={lazyStartIndex}
|
||||
lazyEndIndex={lazyEndIndex}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import React, { Component } from "react";
|
||||
import PropTypes from "prop-types";
|
||||
const defaultHeight = 30;
|
||||
const rowDiff = 3; //行差值
|
||||
const rowDiff = 2; //行差值
|
||||
let treeTypeIndex = 0;
|
||||
export default function bigData(Table) {
|
||||
return class BigData extends Component {
|
||||
|
@ -298,11 +298,12 @@ export default function bigData(Table) {
|
|||
// 向下滚动 下临界值超出缓存的endIndex则重新渲染
|
||||
if (rowsInView + index > endIndex - rowDiff && isOrder) {
|
||||
startIndex = index - loadBuffer > 0 ? index - loadBuffer : 0;
|
||||
// endIndex = startIndex + rowsInView + loadBuffer*2;
|
||||
endIndex = startIndex + loadCount;
|
||||
if (endIndex > data.length) {
|
||||
endIndex = data.length;
|
||||
}
|
||||
if (endIndex !== this.endIndex) {
|
||||
if (endIndex > this.endIndex ) {
|
||||
this.startIndex = startIndex;
|
||||
this.endIndex = endIndex;
|
||||
this.setState({ needRender: !needRender });
|
||||
|
@ -314,7 +315,7 @@ export default function bigData(Table) {
|
|||
if (startIndex < 0) {
|
||||
startIndex = 0;
|
||||
}
|
||||
if (startIndex !== this.startIndex ) {
|
||||
if (startIndex < this.startIndex) {
|
||||
this.startIndex = startIndex;
|
||||
this.endIndex = this.startIndex + loadCount;
|
||||
this.setState({ needRender: !needRender });
|
||||
|
@ -430,6 +431,7 @@ export default function bigData(Table) {
|
|||
}
|
||||
const lazyLoad = {
|
||||
startIndex: startIndex,
|
||||
endIndex:endIndex,
|
||||
startParentIndex: startIndex //为树状节点做准备
|
||||
};
|
||||
if (this.treeType) {
|
||||
|
|
Loading…
Reference in New Issue