vxe-table 3.12.16 → 3.12.17

package/es/table/src/body.js

@@ -381,7 +381,7 @@ function renderRows(h, _vm, fixedType, isOptimizeMode, tableData, tableColumn) {
     const tableReactData = $xeTable;
     const tableInternalData = $xeTable;
     const { stripe, rowKey, highlightHoverRow, rowClassName, rowStyle, editConfig, treeConfig } = tableProps;
-    const { hasFixedColumn, treeExpandedMaps, isColLoading, scrollXLoad, scrollYLoad, isAllOverflow, rowExpandedMaps, expandColumn, selectRadioRow, pendingRowMaps, isDragColMove } = tableReactData;
+    const { hasFixedColumn, treeExpandedMaps, isColLoading, scrollXLoad, scrollYLoad, isAllOverflow, rowExpandedMaps, expandColumn, selectRadioRow, pendingRowMaps, isDragColMove, rowExpandHeightFlag } = tableReactData;
     const { fullAllDataRowIdData } = tableInternalData;
     const checkboxOpts = $xeTable.computeCheckboxOpts;
     const radioOpts = $xeTable.computeRadioOpts;
@@ -414,19 +414,19 @@ function renderRows(h, _vm, fixedType, isOptimizeMode, tableData, tableColumn) {
             };
         }
         const rowid = getRowid($xeTable, row);
-        const rest = fullAllDataRowIdData[rowid];
+        const rowRest = fullAllDataRowIdData[rowid];
         let rowLevel = 0;
         let seq = -1;
         let _rowIndex = 0;
-        if (rest) {
-            rowLevel = rest.level;
+        if (rowRest) {
+            rowLevel = rowRest.level;
             if (treeConfig && transform && seqMode === 'increasing') {
-                seq = rest._index + 1;
+                seq = rowRest._index + 1;
             }
             else {
-                seq = rest.seq;
+                seq = rowRest.seq;
             }
-            _rowIndex = rest._index;
+            _rowIndex = rowRest._index;
         }
         const params = { $table: $xeTable, seq, rowid, fixed: fixedType, type: renderType, level: rowLevel, row, rowIndex, $rowIndex, _rowIndex };
         // 行是否被展开
@@ -493,46 +493,63 @@ function renderRows(h, _vm, fixedType, isOptimizeMode, tableData, tableColumn) {
         // 如果行被展开了
         if (isExpandRow) {
             const expandOpts = $xeTable.computeExpandOpts;
-            const { height: expandHeight, padding } = expandOpts;
-            const cellStyle = {};
-            if (expandHeight) {
-                cellStyle.height = `${expandHeight}px`;
-            }
-            if (treeConfig) {
-                cellStyle.paddingLeft = `${(rowLevel * treeOpts.indent) + 30}px`;
-            }
-            const { showOverflow } = expandColumn;
-            const hasEllipsis = (XEUtils.isUndefined(showOverflow) || XEUtils.isNull(showOverflow)) ? isAllOverflow : showOverflow;
-            const expandParams = { $table: $xeTable, seq, column: expandColumn, fixed: fixedType, type: renderType, level: rowLevel, row, rowIndex, $rowIndex, _rowIndex };
-            rows.push(h('tr', {
-                class: ['vxe-body--expanded-row', {
-                        'is--padding': padding
-                    }],
-                key: `expand_${rowid}`,
-                style: rowStyle ? (XEUtils.isFunction(rowStyle) ? rowStyle(expandParams) : rowStyle) : undefined,
-                on: trOn
-            }, [
-                h('td', {
-                    class: {
-                        'vxe-body--expanded-column': 1,
-                        'fixed--hidden': fixedType && !hasFixedColumn,
-                        'col--ellipsis': hasEllipsis
-                    },
+            const { height: expandHeight, padding, mode: expandMode } = expandOpts;
+            if (expandMode === 'fixed') {
+                rows.push(h('tr', {
+                    class: 'vxe-body--row-expanded-place',
+                    key: `expand_${rowid}`,
                     attrs: {
-                        colspan: tableColumn.length
+                        rowid
                     }
                 }, [
-                    h('div', {
-                        class: {
-                            'vxe-body--expanded-cell': 1,
-                            'is--ellipsis': expandHeight
+                    h('td', {
+                        class: 'vxe-body--row-expanded-place-column',
+                        attrs: {
+                            colspan: tableColumn.length
                         },
-                        style: cellStyle
+                        style: {
+                            height: `${rowExpandHeightFlag ? (rowRest.expandHeight || expandHeight) : 0}px`
+                        }
+                    })
+                ]));
+            }
+            else {
+                const cellStyle = {};
+                if (expandHeight) {
+                    cellStyle.height = `${expandHeight}px`;
+                }
+                if (treeConfig) {
+                    cellStyle.paddingLeft = `${(rowLevel * treeOpts.indent) + 30}px`;
+                }
+                const { showOverflow } = expandColumn;
+                const hasEllipsis = (XEUtils.isUndefined(showOverflow) || XEUtils.isNull(showOverflow)) ? isAllOverflow : showOverflow;
+                const expandParams = { $table: $xeTable, seq, column: expandColumn, fixed: fixedType, type: renderType, level: rowLevel, row, rowIndex, $rowIndex, _rowIndex };
+                rows.push(h('tr', {
+                    class: ['vxe-body--expanded-row', {
+                            'is--padding': padding
+                        }],
+                    key: `expand_${rowid}`
+                }, [
+                    h('td', {
+                        class: ['vxe-body--expanded-column', {
+                                'fixed--hidden': fixedType && !hasFixedColumn,
+                                'col--ellipsis': hasEllipsis
+                            }],
+                        attrs: {
+                            colspan: tableColumn.length
+                        }
                     }, [
-                        expandColumn.renderData(h, expandParams)
+                        h('div', {
+                            class: ['vxe-body--expanded-cell', {
+                                    'is--ellipsis': expandHeight
+                                }],
+                            style: cellStyle
+                        }, [
+                            expandColumn.renderData(h, expandParams)
+                        ])
                     ])
-                ])
-            ]));
+                ]));
+            }
         }
         // 如果是树形表格
         if (isExpandTree) {
@@ -600,14 +617,13 @@ export default {
         const emptyOpts = $xeTable.computeEmptyOpts;
         const mouseOpts = $xeTable.computeMouseOpts;
         const rowDragOpts = $xeTable.computeRowDragOpts;
-        const leftFixedWidth = $xeTable.computeLeftFixedWidth;
-        const rightFixedWidth = $xeTable.computeRightFixedWidth;
+        const expandOpts = $xeTable.computeExpandOpts;
         let renderDataList = tableData;
         let renderColumnList = tableColumn;
         let isOptimizeMode = false;
         // 如果是使用优化模式
         if (scrollXLoad || scrollYLoad || isAllOverflow) {
-            if (expandColumn || spanMethod || footerSpanMethod) {
+            if ((expandColumn && expandOpts.mode !== 'fixed') || spanMethod || footerSpanMethod) {
                 // 如果不支持优化模式
             }
             else {
@@ -687,9 +703,6 @@ export default {
                 $xeTable.triggerBodyScrollEvent(evnt, fixedType);
             }
         };
-        if (scrollYLoad || leftFixedWidth || rightFixedWidth) {
-            ons.wheel = $xeTable.triggerBodyWheelEvent;
-        }
         return h('div', {
             ref: 'refElem',
             class: ['vxe-table--body-wrapper', fixedType ? `fixed-${fixedType}--wrapper` : 'body--wrapper'],

package/es/table/src/methods.js

@@ -1,5 +1,5 @@
 import XEUtils from 'xe-utils';
-import { browse, getTpImg, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, getOffsetPos, setScrollTop, setScrollLeft } from '../../ui/src/dom';
+import { browse, getTpImg, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, getOffsetPos, setScrollTop, setScrollLeft, toCssUnit } from '../../ui/src/dom';
 import { getLastZIndex, nextZIndex, hasChildrenList, getFuncText, isEnableConf, formatText, eqEmptyValue } from '../../ui/src/utils';
 import { VxeUI } from '../../ui';
 import Cell from './cell';
@@ -308,7 +308,7 @@ function updateAfterListIndex($xeTable) {
             rowRest._index = index;
         }
         else {
-            const rest = { row, rowid, seq, index: -1, $index: -1, _index: index, treeIndex: -1, items: [], parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0 };
+            const rest = { row, rowid, seq, index: -1, $index: -1, _index: index, treeIndex: -1, items: [], parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 };
             fullAllDataRowIdData[rowid] = rest;
             fullDataRowIdData[rowid] = rest;
         }
@@ -339,7 +339,7 @@ function updateAfterDataIndex($xeTable) {
                 rowRest.treeIndex = index;
             }
             else {
-                const rest = { row, rowid, seq, index: -1, $index: -1, _index: -1, treeIndex: -1, items: [], parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0 };
+                const rest = { row, rowid, seq, index: -1, $index: -1, _index: -1, treeIndex: -1, items: [], parent: null, level: 0, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 };
                 fullAllDataRowIdData[rowid] = rest;
                 fullDataRowIdData[rowid] = rest;
             }
@@ -403,6 +403,7 @@ function updateStyle($xeTable) {
     const emptyPlaceholderElem = $xeTable.$refs.refEmptyPlaceholder;
     const cellOffsetWidth = $xeTable.computeCellOffsetWidth;
     const mouseOpts = $xeTable.computeMouseOpts;
+    const expandOpts = $xeTable.computeExpandOpts;
     const bodyWrapperElem = getRefElem(elemStore['main-body-wrapper']);
     const bodyTableElem = getRefElem(elemStore['main-body-table']);
     if (emptyPlaceholderElem) {
@@ -472,6 +473,11 @@ function updateStyle($xeTable) {
         yBottomCornerEl.style.top = `${headerHeight + bodyHeight}px`;
         yBottomCornerEl.style.display = footerHeight ? 'block' : '';
     }
+    const rowExpandEl = $xeTable.$refs.refRowExpandElem;
+    if (rowExpandEl) {
+        rowExpandEl.style.height = `${bodyHeight}px`;
+        rowExpandEl.style.top = `${headerHeight}px`;
+    }
     containerList.forEach((name, index) => {
         const fixedType = index > 0 ? name : '';
         const layoutList = ['header', 'body', 'footer'];
@@ -580,7 +586,7 @@ function updateStyle($xeTable) {
                 let isOptimizeMode = false;
                 // 如果是使用优化模式
                 if (scrollXLoad || scrollYLoad || isAllOverflow) {
-                    if (expandColumn || spanMethod || footerSpanMethod) {
+                    if ((expandColumn && expandOpts.mode !== 'fixed') || spanMethod || footerSpanMethod) {
                         // 如果不支持优化模式
                     }
                     else {
@@ -707,6 +713,13 @@ function updateStyle($xeTable) {
     }
     return $xeTable.$nextTick();
 }
+function calcVarRowHeightConfig($xeTable, sizeKey, sizeEl) {
+    const reactData = $xeTable;
+    const { rowHeightStore } = reactData;
+    if (sizeEl && sizeEl.clientHeight) {
+        rowHeightStore[sizeKey] = sizeEl.clientHeight;
+    }
+}
 function computeRowHeight($xeTable) {
     const reactData = $xeTable;
     const { isAllOverflow } = reactData;
@@ -740,8 +753,9 @@ function computeRowHeight($xeTable) {
 function handleVirtualYVisible($xeTable, currScrollTop) {
     const reactData = $xeTable;
     const internalData = $xeTable;
-    const { isAllOverflow } = reactData;
+    const { isAllOverflow, expandColumn, rowExpandedMaps } = reactData;
     const { elemStore, isResizeCellHeight, afterFullData, fullAllDataRowIdData } = internalData;
+    const expandOpts = $xeTable.computeExpandOpts;
     const rowOpts = $xeTable.computeRowOpts;
     const cellOpts = $xeTable.computeCellOpts;
     const defaultRowHeight = $xeTable.computeDefaultRowHeight;
@@ -754,7 +768,7 @@ function handleVirtualYVisible($xeTable, currScrollTop) {
         let offsetTop = 0;
         let visibleSize = 0;
         const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height;
-        if (!isCustomCellHeight && isAllOverflow) {
+        if (!isCustomCellHeight && !expandColumn && isAllOverflow) {
             toVisibleIndex = Math.floor(scrollTop / defaultRowHeight);
             visibleSize = Math.ceil(clientHeight / defaultRowHeight) + 1;
         }
@@ -773,6 +787,10 @@ function handleVirtualYVisible($xeTable, currScrollTop) {
                         break;
                     }
                 }
+                // 是否展开行
+                if (expandColumn && rowExpandedMaps[rowid]) {
+                    offsetTop += rowRest.expandHeight || expandOpts.height || 0;
+                }
             }
         }
         return { toVisibleIndex: Math.max(0, toVisibleIndex), visibleSize: Math.max(6, visibleSize) };
@@ -1393,9 +1411,18 @@ function handleRecalculateLayout($xeTable, reFull) {
     if (!el || !el.clientWidth) {
         return $xeTable.$nextTick();
     }
+    const varEl = $xeTable.$refs.refVarElem;
+    if (varEl) {
+        const [defEl, mediumEl, smallEl, miniEl] = varEl.children;
+        calcVarRowHeightConfig($xeTable, 'default', defEl);
+        calcVarRowHeightConfig($xeTable, 'medium', mediumEl);
+        calcVarRowHeightConfig($xeTable, 'small', smallEl);
+        calcVarRowHeightConfig($xeTable, 'mini', miniEl);
+    }
     calcCellWidth($xeTable);
     autoCellWidth($xeTable);
     updateStyle($xeTable);
+    updateRowExpandStyle($xeTable);
     return computeScrollLoad($xeTable).then(() => {
         if (reFull === true) {
             // 初始化时需要在列计算之后再执行优化运算，达到最优显示效果
@@ -1403,6 +1430,7 @@ function handleRecalculateLayout($xeTable, reFull) {
             calcCellWidth($xeTable);
             autoCellWidth($xeTable);
             updateStyle($xeTable);
+            updateRowExpandStyle($xeTable);
             return computeScrollLoad($xeTable);
         }
     });
@@ -1823,7 +1851,7 @@ function calcCellWidth($xeTable) {
         el.removeAttribute('data-calc-col');
     }
 }
-const handleUpdateColResize = ($xeTable, evnt, params) => {
+function handleUpdateColResize($xeTable, evnt, params) {
     $xeTable.analyColumnWidth();
     $xeTable.recalculate(true).then(() => {
         $xeTable.saveCustomStore('update:width');
@@ -1833,8 +1861,8 @@ const handleUpdateColResize = ($xeTable, evnt, params) => {
         $xeTable.dispatchEvent('resizable-change', params, evnt);
         setTimeout(() => $xeTable.recalculate(true), 300);
     });
-};
-const handleUpdateRowResize = ($xeTable, evnt, params) => {
+}
+function handleUpdateRowResize($xeTable, evnt, params) {
     const reactData = $xeTable;
     reactData.resizeHeightFlag++;
     $xeTable.recalculate(true).then(() => {
@@ -1842,7 +1870,65 @@ const handleUpdateRowResize = ($xeTable, evnt, params) => {
         $xeTable.dispatchEvent('row-resizable-change', params, evnt);
         setTimeout(() => $xeTable.recalculate(true), 300);
     });
-};
+}
+function updateRowExpandStyle($xeTable) {
+    const reactData = $xeTable;
+    const internalData = $xeTable;
+    const { expandColumn, scrollYLoad, rowExpandedMaps } = reactData;
+    const expandOpts = $xeTable.computeExpandOpts;
+    const rowOpts = $xeTable.computeRowOpts;
+    const cellOpts = $xeTable.computeCellOpts;
+    const defaultRowHeight = $xeTable.computeDefaultRowHeight;
+    const { mode } = expandOpts;
+    if (expandColumn && mode === 'fixed') {
+        const { elemStore, afterFullData, fullAllDataRowIdData } = internalData;
+        const rowExpandEl = $xeTable.$refs.refRowExpandElem;
+        const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
+        if (rowExpandEl && bodyScrollElem) {
+            let isUpdateHeight = false;
+            if (scrollYLoad) {
+                let offsetTop = 0;
+                for (let rIndex = 0, rLen = afterFullData.length; rIndex < rLen; rIndex++) {
+                    const row = afterFullData[rIndex];
+                    const rowid = getRowid($xeTable, row);
+                    const rowRest = fullAllDataRowIdData[rowid] || {};
+                    rowRest.oTop = offsetTop;
+                    offsetTop += rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight;
+                    // 是否展开行
+                    if (expandColumn && rowExpandedMaps[rowid]) {
+                        offsetTop += rowRest.expandHeight || expandOpts.height || 0;
+                    }
+                }
+            }
+            XEUtils.arrayEach(rowExpandEl.children, reEl => {
+                const expandEl = reEl;
+                const rowid = expandEl.getAttribute('rowid') || '';
+                const rowRest = fullAllDataRowIdData[rowid];
+                if (rowRest) {
+                    const expandHeight = expandEl.offsetHeight + 1;
+                    if (scrollYLoad) {
+                        expandEl.style.top = toCssUnit(rowRest.oTop + (rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight));
+                    }
+                    else {
+                        const trEl = bodyScrollElem.querySelector(`.vxe-body--row[rowid="${rowid}"]`);
+                        if (trEl) {
+                            expandEl.style.top = toCssUnit(trEl.offsetTop + trEl.offsetHeight);
+                        }
+                    }
+                    if (!isUpdateHeight) {
+                        if (rowRest.expandHeight !== expandHeight) {
+                            isUpdateHeight = true;
+                        }
+                    }
+                    rowRest.expandHeight = expandHeight;
+                }
+            });
+            if (isUpdateHeight) {
+                reactData.rowExpandHeightFlag++;
+            }
+        }
+    }
+}
 const Methods = {
     callSlot(slotFunc, params, h, vNodes) {
         if (slotFunc) {
@@ -2223,7 +2309,7 @@ const Methods = {
             }
             let cacheItem = fullAllDataRowIdData[rowid];
             if (isReset || !cacheItem) {
-                cacheItem = { row, rowid, seq, index: -1, _index: -1, $index: -1, treeIndex: index, items, parent: parentRow, level, height: 0, resizeHeight: 0, oTop: 0 };
+                cacheItem = { row, rowid, seq, index: -1, _index: -1, $index: -1, treeIndex: index, items, parent: parentRow, level, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 };
             }
             cacheItem.row = row;
             cacheItem.items = items;
@@ -2297,7 +2383,7 @@ const Methods = {
             XEUtils.eachTree(rows, (childRow, index, items, path, parentItem, nodes) => {
                 const rowid = getRowid($xeTable, childRow);
                 const parentRow = parentItem || parentRest.row;
-                const rest = { row: childRow, rowid, seq: -1, index, _index: -1, $index: -1, treeIndex: -1, items, parent: parentRow, level: parentLevel + nodes.length, height: 0, resizeHeight: 0, oTop: 0 };
+                const rest = { row: childRow, rowid, seq: -1, index, _index: -1, $index: -1, treeIndex: -1, items, parent: parentRow, level: parentLevel + nodes.length, height: 0, resizeHeight: 0, oTop: 0, expandHeight: 0 };
                 fullDataRowIdData[rowid] = rest;
                 fullAllDataRowIdData[rowid] = rest;
             }, { children: childrenField });
@@ -4121,6 +4207,7 @@ const Methods = {
             const el = $xeTable.$refs.refElem;
             if (el && el.clientWidth) {
                 autoCellWidth($xeTable);
+                updateRowExpandStyle($xeTable);
             }
             if (rceTimeout) {
                 clearTimeout(rceTimeout);
@@ -7781,6 +7868,7 @@ const Methods = {
             isLeft,
             isRight,
             direction }, params);
+        updateRowExpandStyle($xeTable);
         checkLastSyncScroll($xeTable, isRollX, isRollY);
         if (rowOpts.isHover || highlightHoverRow) {
             $xeTable.clearHoverRow();
@@ -7835,6 +7923,7 @@ const Methods = {
         const rightScrollElem = getRefElem(elemStore['right-body-scroll']);
         const headerScrollElem = getRefElem(elemStore['main-header-scroll']);
         const footerScrollElem = getRefElem(elemStore['main-footer-scroll']);
+        const rowExpandEl = $xeTable.$refs.refRowExpandElem;
         if (inWheelScroll || inVirtualScroll || inHeaderScroll || inFooterScroll) {
             return;
         }
@@ -7885,6 +7974,7 @@ const Methods = {
                 setScrollTop(rightScrollElem, scrollTop);
             }
             setScrollTop(yHandleEl, scrollTop);
+            setScrollTop(rowExpandEl, scrollTop);
             if (scrollYLoad) {
                 $xeTable.triggerScrollYEvent(evnt);
             }
@@ -8004,6 +8094,7 @@ const Methods = {
         const leftScrollElem = getRefElem(elemStore['left-body-scroll']);
         const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
         const rightScrollElem = getRefElem(elemStore['right-body-scroll']);
+        const rowExpandEl = $xeTable.$refs.refRowExpandElem;
         if (!xHandleEl) {
             return;
         }
@@ -8039,6 +8130,7 @@ const Methods = {
                 setScrollTop(bodyScrollElem, currTopNum);
                 setScrollTop(leftScrollElem, currTopNum);
                 setScrollTop(rightScrollElem, currTopNum);
+                setScrollTop(rowExpandEl, currTopNum);
                 if (scrollYLoad) {
                     $xeTable.triggerScrollYEvent(evnt);
                 }
@@ -8047,16 +8139,6 @@ const Methods = {
                     fixed: ''
                 });
             });
-            // internalData.inWheelScroll = true
-            // setScrollTop(yHandleEl, scrollTop)
-            // setScrollTop(bodyScrollElem, scrollTop)
-            // setScrollTop(leftScrollElem, scrollTop)
-            // setScrollTop(rightScrollElem, scrollTop)
-            // loadScrollYData($xeTable, scrollTop)
-            // $xeTable.handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, {
-            //   type: 'footer',
-            //   fixed: ''
-            // })
         }
     },
     triggerVirtualScrollXEvent(evnt) {
@@ -8111,6 +8193,7 @@ const Methods = {
         const leftScrollElem = getRefElem(elemStore['left-body-scroll']);
         const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
         const rightScrollElem = getRefElem(elemStore['right-body-scroll']);
+        const rowExpandEl = $xeTable.$refs.refRowExpandElem;
         const xHandleEl = $xeTable.$refs.refScrollXHandleElem;
         const wrapperEl = evnt.currentTarget;
         const { scrollTop } = wrapperEl;
@@ -8125,6 +8208,7 @@ const Methods = {
         setScrollTop(bodyScrollElem, scrollTop);
         setScrollTop(leftScrollElem, scrollTop);
         setScrollTop(rightScrollElem, scrollTop);
+        setScrollTop(rowExpandEl, scrollTop);
         if (scrollYLoad) {
             $xeTable.triggerScrollYEvent(evnt);
         }
@@ -8138,6 +8222,7 @@ const Methods = {
         const reactData = $xeTable;
         const { isAllOverflow } = reactData;
         handleTableColumn($xeTable);
+        $xeTable.updateScrollXSpace();
         return $xeTable.$nextTick().then(() => {
             handleTableColumn($xeTable);
             $xeTable.updateScrollXSpace();
@@ -8197,6 +8282,7 @@ const Methods = {
     updateScrollYData() {
         const $xeTable = this;
         $xeTable.handleTableData();
+        $xeTable.updateScrollYSpace();
         return $xeTable.$nextTick().then(() => {
             $xeTable.handleTableData();
             $xeTable.updateScrollYSpace();
@@ -8207,9 +8293,10 @@ const Methods = {
         const $xeTable = this;
         const reactData = $xeTable;
         const internalData = $xeTable;
-        const { isAllOverflow, scrollYLoad } = reactData;
+        const { isAllOverflow, scrollYLoad, expandColumn, rowExpandedMaps } = reactData;
         const { scrollYStore, elemStore, isResizeCellHeight, afterFullData, fullAllDataRowIdData } = internalData;
         const { startIndex } = scrollYStore;
+        const expandOpts = $xeTable.computeExpandOpts;
         const rowOpts = $xeTable.computeRowOpts;
         const cellOpts = $xeTable.computeCellOpts;
         const defaultRowHeight = $xeTable.computeDefaultRowHeight;
@@ -8219,7 +8306,7 @@ const Methods = {
         let ySpaceHeight = 0;
         if (scrollYLoad) {
             const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height;
-            if (!isCustomCellHeight && isAllOverflow) {
+            if (!isCustomCellHeight && !expandColumn && isAllOverflow) {
                 ySpaceHeight = afterFullData.length * defaultRowHeight;
                 topSpaceHeight = Math.max(0, startIndex * defaultRowHeight);
             }
@@ -8229,12 +8316,20 @@ const Methods = {
                     const rowid = getRowid($xeTable, row);
                     const rowRest = fullAllDataRowIdData[rowid] || {};
                     ySpaceHeight += rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight;
+                    // 是否展开行
+                    if (expandColumn && rowExpandedMaps[rowid]) {
+                        ySpaceHeight += rowRest.expandHeight || expandOpts.height || 0;
+                    }
                 }
                 for (let i = 0; i < startIndex; i++) {
                     const row = afterFullData[i];
                     const rowid = getRowid($xeTable, row);
                     const rowRest = fullAllDataRowIdData[rowid] || {};
                     topSpaceHeight += rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight;
+                    // 是否展开行
+                    if (expandColumn && rowExpandedMaps[rowid]) {
+                        topSpaceHeight += rowRest.expandHeight || expandOpts.height || 0;
+                    }
                 }
             }
         }
@@ -8260,6 +8355,10 @@ const Methods = {
         if (scrollYSpaceEl) {
             scrollYSpaceEl.style.height = ySpaceHeight ? `${ySpaceHeight}px` : '';
         }
+        const rowExpandYSpaceEl = $xeTable.$refs.refRowExpandYSpaceElem;
+        if (rowExpandYSpaceEl) {
+            rowExpandYSpaceEl.style.height = ySpaceHeight ? `${ySpaceHeight}px` : '';
+        }
         return $xeTable.$nextTick().then(() => {
             updateStyle($xeTable);
         });