vxe-table 3.12.10-beta.2 → 3.12.10-beta.21

package/packages/table/src/methods.ts

@@ -1,5 +1,5 @@
 import XEUtils from 'xe-utils'
-import { browse, getTpImg, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, setScrollTop, setScrollLeft } from '../../ui/src/dom'
+import { browse, getTpImg, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, getOffsetPos, setScrollTop, setScrollLeft } from '../../ui/src/dom'
 import { getLastZIndex, nextZIndex, hasChildrenList, getFuncText, isEnableConf, formatText, eqEmptyValue } from '../../ui/src/utils'
 import { VxeUI } from '../../ui'
 import Cell from './cell'
@@ -213,7 +213,7 @@ function cacheColumnMap ($xeTable: VxeTableConstructor) {
       }
       fullColumnFieldData[field] = rest
     } else {
-      if (storage || (columnOpts.drag && (isCrossDrag || isSelfToChildDrag))) {
+      if ((storage && !type) || (columnOpts.drag && (isCrossDrag || isSelfToChildDrag))) {
         errLog('vxe.error.reqProp', [`${column.getTitle() || type || ''} -> column.field`])
       }
     }
@@ -316,6 +316,64 @@ const updateScrollYStatus = ($xeTable: VxeTableConstructor, fullData?: any[]) =>
   return scrollYLoad
 }
 
+function updateAfterListIndex ($xeTable: VxeTableConstructor) {
+  const internalData = $xeTable as unknown as TableInternalData
+
+  const { afterFullData, fullDataRowIdData, fullAllDataRowIdData } = internalData
+  const fullMaps: Record<string, any> = {}
+  afterFullData.forEach((row, index) => {
+    const rowid = getRowid($xeTable, row)
+    const rowRest = fullAllDataRowIdData[rowid]
+    const seq = index + 1
+    if (rowRest) {
+      rowRest.seq = seq
+      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 }
+      fullAllDataRowIdData[rowid] = rest
+      fullDataRowIdData[rowid] = rest
+    }
+    fullMaps[rowid] = row
+  })
+  internalData.afterFullRowMaps = fullMaps
+}
+
+/**
+ * 预编译
+ * 对渲染中的数据提前解析序号及索引。牺牲提前编译耗时换取渲染中额外损耗，使运行时更加流畅
+ */
+function updateAfterDataIndex ($xeTable: VxeTableConstructor) {
+  const props = $xeTable
+  const internalData = $xeTable as unknown as TableInternalData
+
+  const { treeConfig } = props
+  const { fullDataRowIdData, fullAllDataRowIdData, afterTreeFullData } = internalData
+  const treeOpts = $xeTable.computeTreeOpts
+  const { transform } = treeOpts
+  const childrenField = treeOpts.children || treeOpts.childrenField
+  const fullMaps: Record<string, any> = {}
+  if (treeConfig) {
+    XEUtils.eachTree(afterTreeFullData, (row, index, items, path) => {
+      const rowid = getRowid($xeTable, row)
+      const rowRest = fullAllDataRowIdData[rowid]
+      const seq = path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('')
+      if (rowRest) {
+        rowRest.seq = seq
+        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 }
+        fullAllDataRowIdData[rowid] = rest
+        fullDataRowIdData[rowid] = rest
+      }
+      fullMaps[rowid] = row
+    }, { children: transform ? treeOpts.mapChildrenField : childrenField })
+    internalData.afterFullRowMaps = fullMaps
+    updateAfterListIndex($xeTable)
+  } else {
+    updateAfterListIndex($xeTable)
+  }
+}
+
 /**
  * 如果为虚拟树，将树结构拍平
  * @returns
@@ -360,13 +418,15 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
   const internalData = $xeTable as unknown as TableInternalData
 
   const { border, showOverflow: allColumnOverflow, showHeaderOverflow: allColumnHeaderOverflow, showFooterOverflow: allColumnFooterOverflow, mouseConfig, spanMethod, footerSpanMethod } = props
-  const { isGroup, currentRow, tableColumn, scrollXLoad, scrollYLoad, scrollbarWidth, scrollbarHeight, columnStore, editStore, isAllOverflow, expandColumn } = reactData
+  const { isGroup, currentRow, tableColumn, scrollXLoad, scrollYLoad, overflowX, scrollbarWidth, overflowY, scrollbarHeight, columnStore, editStore, isAllOverflow, expandColumn } = reactData
   const { visibleColumn, fullColumnIdData, tableHeight, tableWidth, headerHeight, footerHeight, elemStore, customHeight, customMinHeight, customMaxHeight } = internalData
   const el = $xeTable.$refs.refElem as HTMLDivElement
   if (!el) {
     return
   }
   const containerList = ['main', 'left', 'right']
+  const osbWidth = overflowY ? scrollbarWidth : 0
+  const osbHeight = overflowX ? scrollbarHeight : 0
   const emptyPlaceholderElem = $xeTable.$refs.refEmptyPlaceholder as HTMLDivElement
   const cellOffsetWidth = $xeTable.computeCellOffsetWidth
   const mouseOpts = $xeTable.computeMouseOpts
@@ -374,17 +434,17 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
   const bodyTableElem = getRefElem(elemStore['main-body-table'])
   if (emptyPlaceholderElem) {
     emptyPlaceholderElem.style.top = `${headerHeight}px`
-    emptyPlaceholderElem.style.height = bodyWrapperElem ? `${bodyWrapperElem.offsetHeight - scrollbarHeight}px` : ''
+    emptyPlaceholderElem.style.height = bodyWrapperElem ? `${bodyWrapperElem.offsetHeight - osbHeight}px` : ''
   }
 
   let bodyHeight = 0
   let bodyMaxHeight = 0
-  const bodyMinHeight = customMinHeight - headerHeight - footerHeight - scrollbarHeight
+  const bodyMinHeight = customMinHeight - headerHeight - footerHeight - osbHeight
   if (customMaxHeight) {
-    bodyMaxHeight = Math.max(bodyMinHeight, customMaxHeight - headerHeight - footerHeight - scrollbarHeight)
+    bodyMaxHeight = Math.max(bodyMinHeight, customMaxHeight - headerHeight - footerHeight - osbHeight)
   }
   if (customHeight) {
-    bodyHeight = customHeight - headerHeight - footerHeight - scrollbarHeight
+    bodyHeight = customHeight - headerHeight - footerHeight - osbHeight
   }
   if (!bodyHeight) {
     if (bodyTableElem) {
@@ -398,36 +458,43 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
     bodyHeight = Math.max(bodyMinHeight, bodyHeight)
   }
 
+  const xLeftCornerEl = $xeTable.$refs.refScrollXLeftCornerElem as HTMLDivElement
+  const xRightCornerEl = $xeTable.$refs.refScrollXRightCornerElem as HTMLDivElement
+  const scrollbarXToTop = $xeTable.computeScrollbarXToTop
   const scrollXVirtualEl = $xeTable.$refs.refScrollXVirtualElem as HTMLDivElement
   if (scrollXVirtualEl) {
-    scrollXVirtualEl.style.height = `${scrollbarHeight}px`
-    scrollXVirtualEl.style.visibility = scrollbarHeight ? 'visible' : 'hidden'
+    scrollXVirtualEl.style.height = `${osbHeight}px`
+    scrollXVirtualEl.style.visibility = overflowX ? 'visible' : 'hidden'
   }
-  const xHandleEl = $xeTable.$refs.refScrollXHandleElem as HTMLDivElement
-  if (xHandleEl) {
-    xHandleEl.style.width = `${el.clientWidth - scrollbarWidth}px`
+  const xWrapperEl = $xeTable.$refs.refScrollXWrapperElem as HTMLDivElement
+  if (xWrapperEl) {
+    xWrapperEl.style.left = scrollbarXToTop ? `${osbWidth}px` : ''
+    xWrapperEl.style.width = `${el.clientWidth - osbWidth}px`
+  }
+  if (xLeftCornerEl) {
+    xLeftCornerEl.style.width = scrollbarXToTop ? `${osbWidth}px` : ''
+    xLeftCornerEl.style.display = scrollbarXToTop ? (osbWidth && osbHeight ? 'block' : '') : ''
   }
-  const xRightCornerEl = $xeTable.$refs.refScrollXRightCornerElem as HTMLDivElement
   if (xRightCornerEl) {
-    xRightCornerEl.style.width = `${scrollbarWidth}px`
-    xRightCornerEl.style.display = scrollbarWidth && scrollbarHeight ? 'block' : ''
+    xRightCornerEl.style.width = scrollbarXToTop ? '' : `${osbWidth}px`
+    xRightCornerEl.style.display = scrollbarXToTop ? '' : (osbWidth && osbHeight ? 'block' : '')
   }
 
   const scrollYVirtualEl = $xeTable.$refs.refScrollYVirtualElem as HTMLDivElement
   if (scrollYVirtualEl) {
-    scrollYVirtualEl.style.width = `${scrollbarWidth}px`
+    scrollYVirtualEl.style.width = `${osbWidth}px`
     scrollYVirtualEl.style.height = `${bodyHeight + headerHeight + footerHeight}px`
-    scrollYVirtualEl.style.visibility = scrollbarWidth ? 'visible' : 'hidden'
+    scrollYVirtualEl.style.visibility = overflowY ? 'visible' : 'hidden'
   }
   const yTopCornerEl = $xeTable.$refs.refScrollYTopCornerElem as HTMLDivElement
   if (yTopCornerEl) {
     yTopCornerEl.style.height = `${headerHeight}px`
     yTopCornerEl.style.display = headerHeight ? 'block' : ''
   }
-  const yHandleEl = $xeTable.$refs.refScrollYHandleElem as HTMLDivElement
-  if (yHandleEl) {
-    yHandleEl.style.height = `${bodyHeight}px`
-    yHandleEl.style.top = `${headerHeight}px`
+  const yWrapperEl = $xeTable.$refs.refScrollYWrapperElem as HTMLDivElement
+  if (yWrapperEl) {
+    yWrapperEl.style.height = `${bodyHeight}px`
+    yWrapperEl.style.top = `${headerHeight}px`
   }
   const yBottomCornerEl = $xeTable.$refs.refScrollYBottomCornerElem as HTMLDivElement
   if (yBottomCornerEl) {
@@ -543,7 +610,7 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
           if (wrapperElem) {
             wrapperElem.style.top = `${headerHeight}px`
           }
-          fixedWrapperElem.style.height = `${customHeight > 0 ? customHeight : (tableHeight + headerHeight + footerHeight + scrollbarHeight)}px`
+          fixedWrapperElem.style.height = `${customHeight > 0 ? customHeight : (tableHeight + headerHeight + footerHeight + osbHeight)}px`
           fixedWrapperElem.style.width = `${fixedColumn.reduce((previous, column) => previous + column.renderWidth, 0)}px`
         }
 
@@ -578,7 +645,7 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
         if (tableElem) {
           tableElem.style.width = tWidth ? `${tWidth}px` : ''
           // 兼容性处理
-          tableElem.style.paddingRight = scrollbarWidth && fixedType && (browse['-moz'] || browse.safari) ? `${scrollbarWidth}px` : ''
+          tableElem.style.paddingRight = osbWidth && fixedType && (browse['-moz'] || browse.safari) ? `${osbWidth}px` : ''
         }
         const emptyBlockElem = getRefElem(elemStore[`${name}-${layout}-emptyBlock`])
         if (emptyBlockElem) {
@@ -618,7 +685,7 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
           // 如果是固定列
           if (fixedWrapperElem) {
             if (wrapperElem) {
-              wrapperElem.style.top = `${customHeight > 0 ? customHeight - footerHeight - scrollbarHeight : tableHeight + headerHeight}px`
+              wrapperElem.style.top = `${customHeight > 0 ? customHeight - footerHeight - osbHeight : tableHeight + headerHeight}px`
             }
           }
         }
@@ -686,53 +753,63 @@ function updateStyle ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
 }
 
 function computeRowHeight ($xeTable: VxeTableConstructor) {
+  const props = $xeTable
+
+  const { showOverflow } = props
   const tableHeader = $xeTable.$refs.refTableHeader
   const tableBody = $xeTable.$refs.refTableBody
   const tableBodyElem = tableBody ? (tableBody as any).$el as HTMLDivElement : null
   const defaultRowHeight = $xeTable.computeDefaultRowHeight
   let rowHeight = 0
-  if (tableBodyElem) {
-    const tableHeaderElem = tableHeader ? (tableHeader as any).$el as HTMLDivElement : null
-    let firstTrElem
-    firstTrElem = tableBodyElem.querySelector('tr')
-    if (!firstTrElem && tableHeaderElem) {
-      firstTrElem = tableHeaderElem.querySelector('tr')
+  if (showOverflow) {
+    if (tableBodyElem) {
+      const tableHeaderElem = tableHeader ? (tableHeader as any).$el as HTMLDivElement : null
+      let firstTrElem
+      firstTrElem = tableBodyElem.querySelector('tr')
+      if (!firstTrElem && tableHeaderElem) {
+        firstTrElem = tableHeaderElem.querySelector('tr')
+      }
+      if (firstTrElem) {
+        rowHeight = firstTrElem.clientHeight
+      }
     }
-    if (firstTrElem) {
-      rowHeight = firstTrElem.clientHeight
+    if (!rowHeight) {
+      rowHeight = defaultRowHeight
     }
-  }
-  if (!rowHeight) {
+  } else {
     rowHeight = defaultRowHeight
   }
   // 最低支持 18px 行高
   return Math.max(18, rowHeight)
 }
 
-function handleVirtualYVisible ($xeTable: VxeTableConstructor) {
+function handleVirtualYVisible ($xeTable: VxeTableConstructor, currScrollTop?: number) {
   const props = $xeTable
-  const reactData = $xeTable as unknown as TableReactData
   const internalData = $xeTable as unknown as TableInternalData
 
   const { showOverflow } = props
-  const { rowHeight } = reactData
-  const { elemStore, afterFullData, fullAllDataRowIdData } = internalData
+  const { elemStore, isResizeCellHeight, afterFullData, fullAllDataRowIdData } = internalData
+  const rowOpts = $xeTable.computeRowOpts
+  const cellOpts = $xeTable.computeCellOpts
+  const defaultRowHeight = $xeTable.computeDefaultRowHeight
   const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
   if (bodyScrollElem) {
-    const { scrollTop, clientHeight } = bodyScrollElem
+    const clientHeight = bodyScrollElem.clientHeight
+    const scrollTop = XEUtils.isNumber(currScrollTop) ? currScrollTop : bodyScrollElem.scrollTop
     const endHeight = scrollTop + clientHeight
     let toVisibleIndex = -1
     let offsetTop = 0
     let visibleSize = 0
-    if (showOverflow) {
-      toVisibleIndex = Math.floor(scrollTop / rowHeight)
-      visibleSize = Math.ceil(clientHeight / rowHeight) + 1
+    const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height
+    if (!isCustomCellHeight && showOverflow) {
+      toVisibleIndex = Math.floor(scrollTop / defaultRowHeight)
+      visibleSize = Math.ceil(clientHeight / defaultRowHeight) + 1
     } else {
       for (let rIndex = 0, rLen = afterFullData.length; rIndex < rLen; rIndex++) {
         const row = afterFullData[rIndex]
         const rowid = getRowid($xeTable, row)
         const rowRest = fullAllDataRowIdData[rowid]
-        offsetTop += rowRest ? (rowRest.height || rowHeight) : rowHeight
+        offsetTop += rowRest ? (rowRest.resizeHeight || cellOpts.height || rowOpts.height || defaultRowHeight) : defaultRowHeight
         if (toVisibleIndex === -1 && scrollTop < offsetTop) {
           toVisibleIndex = rIndex
         }
@@ -988,7 +1065,7 @@ function autoCellWidth ($xeTable: VxeTableConstructor & VxeTablePrivateMethods)
   }
   const tableHeight = bodyElem.offsetHeight
   const overflowY = yHandleEl.scrollHeight > yHandleEl.clientHeight
-  reactData.scrollbarWidth = overflowY ? Math.max(scrollbarOpts.width || 0, yHandleEl.offsetWidth - yHandleEl.clientWidth) : 0
+  reactData.scrollbarWidth = Math.max(scrollbarOpts.width || 0, yHandleEl.offsetWidth - yHandleEl.clientWidth)
   reactData.overflowY = overflowY
   internalData.tableWidth = tableWidth
   internalData.tableHeight = tableHeight
@@ -998,7 +1075,7 @@ function autoCellWidth ($xeTable: VxeTableConstructor & VxeTablePrivateMethods)
   const headerHeight = headerTableElem ? headerTableElem.clientHeight : 0
   const overflowX = tableWidth > bodyWidth
   const footerHeight = footerTableElem ? footerTableElem.clientHeight : 0
-  reactData.scrollbarHeight = overflowX ? Math.max(scrollbarOpts.height || 0, xHandleEl.offsetHeight - xHandleEl.clientHeight) : 0
+  reactData.scrollbarHeight = Math.max(scrollbarOpts.height || 0, xHandleEl.offsetHeight - xHandleEl.clientHeight)
   internalData.headerHeight = headerHeight
   internalData.footerHeight = footerHeight
   reactData.overflowX = overflowX
@@ -1009,21 +1086,22 @@ function autoCellWidth ($xeTable: VxeTableConstructor & VxeTablePrivateMethods)
   }
 }
 
-// const updateCellOffset = ($xeTable: VxeTableConstructor) => {
-//   const internalData = $xeTable as unknown as TableInternalData
-
-//   const { chTimeout, chRunTime } = internalData
-//   if (chTimeout) {
-//     clearTimeout(chTimeout)
-//   }
-//   if (!chRunTime || chRunTime + 10 < Date.now()) {
-//     internalData.chRunTime = Date.now()
-//   }
-//   internalData.chTimeout = setTimeout(() => {
-//     internalData.chRunTime = undefined
-//     internalData.chTimeout = undefined
-//   }, 80)
-// }
+const calcCellAutoHeight = (rowRest: VxeTableDefines.RowCacheItem, wrapperEl: HTMLDivElement) => {
+  const cellElemList = wrapperEl.querySelectorAll(`.vxe-cell--wrapper[rowid="${rowRest.rowid}"]`)
+  let topBottomPadding = 0
+  const firstCellEl = cellElemList[0]
+  if (firstCellEl && firstCellEl.parentElement) {
+    const cellStyle = getComputedStyle(firstCellEl.parentElement)
+    topBottomPadding = Math.ceil(XEUtils.toNumber(cellStyle.paddingTop) + XEUtils.toNumber(cellStyle.paddingBottom))
+  }
+  let colHeight = rowRest.height - topBottomPadding
+  for (let i = 0; i < cellElemList.length; i++) {
+    const cellElem = cellElemList[i] as HTMLElement
+    const cellHeight = cellElem ? cellElem.clientHeight : 0
+    colHeight = Math.max(colHeight, Math.ceil(cellHeight))
+  }
+  return colHeight + topBottomPadding
+}
 
 const calcCellHeight = ($xeTable: VxeTableConstructor) => {
   const props = $xeTable
@@ -1031,42 +1109,21 @@ const calcCellHeight = ($xeTable: VxeTableConstructor) => {
   const internalData = $xeTable as unknown as TableInternalData
 
   const { showOverflow } = props
-  const { tableData, scrollXLoad } = reactData
+  const { tableData, scrollYLoad, scrollXLoad } = reactData
   const { fullAllDataRowIdData } = internalData
+  const defaultRowHeight = $xeTable.computeDefaultRowHeight
   const el = $xeTable.$refs.refElem as HTMLDivElement
-  if (!showOverflow && el) {
-    let paddingTop = 0
-    let paddingBottom = 0
-    let calcPadding = false
+  if (!showOverflow && scrollYLoad && el) {
     tableData.forEach(row => {
       const rowid = getRowid($xeTable, row)
       const rowRest = fullAllDataRowIdData[rowid]
-      const cellList = el.querySelectorAll(`.vxe-body--row[rowid="${rowid}"]>.vxe-body--column>.vxe-cell`)
-      if (rowRest && cellList.length) {
-        let height = 0
-        for (let i = 0; i < cellList.length; i++) {
-          const cellElem = cellList[i] as HTMLElement
-          const tdEl = cellElem.parentElement as HTMLTableCellElement
-          if (!tdEl || !tdEl.clientWidth) {
-            break
-          }
-          if (!calcPadding) {
-            paddingTop = XEUtils.toNumber(getComputedStyle(tdEl).paddingTop)
-            paddingBottom = XEUtils.toNumber(getComputedStyle(tdEl).paddingBottom)
-            calcPadding = true
-          }
-          let cellHeight = paddingTop + paddingBottom
-          if (cellElem) {
-            cellHeight += cellElem.clientHeight
-          }
-          height = Math.max(height, cellHeight)
-        }
-        rowRest.height = scrollXLoad ? Math.max(rowRest.height, height) : height
+      if (rowRest) {
+        const height = calcCellAutoHeight(rowRest, el)
+        rowRest.height = Math.max(defaultRowHeight, scrollXLoad ? Math.max(rowRest.height, height) : height)
       }
     })
-    reactData.isCalcCellHeight++
+    reactData.calcCellHeightFlag++
   }
-  // updateCellOffset()
 }
 
 function getOrderField (_vm: any, column: any) {
@@ -1089,6 +1146,20 @@ function getOrderField (_vm: any, column: any) {
   }
 }
 
+function handleTargetEnterEvent ($xeTable: VxeTableConstructor, isClear: boolean) {
+  const internalData = $xeTable as unknown as TableInternalData
+
+  const $tooltip = $xeTable.$refs.refTooltip as VxeTooltipInstance
+  clearTimeout(internalData.tooltipTimeout)
+  if (isClear) {
+    $xeTable.closeTooltip()
+  } else {
+    if ($tooltip && $tooltip.setActived) {
+      $tooltip.setActived(true)
+    }
+  }
+}
+
 function clearDragStatus ($xeTable: any) {
   const reactData = $xeTable
 
@@ -1188,33 +1259,37 @@ function updateColDropTipContent ($xeTable: any, tdEl: HTMLElement) {
   reactData.dragTipText = tipContent
 }
 
-function showDropTip ($xeTable: any, evnt: DragEvent | MouseEvent, trEl: HTMLElement | null, thEl: HTMLElement | null, showLine: boolean, dragPos: string) {
-  const reactData = $xeTable
-  const internalData = $xeTable
+function showDropTip ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, evnt: DragEvent | MouseEvent, trEl: HTMLElement | null, thEl: HTMLElement | null, showLine: boolean, dragPos: string) {
+  const reactData = $xeTable as unknown as TableReactData
+  const internalData = $xeTable as unknown as TableInternalData
 
   const el = $xeTable.$refs.refElem as HTMLElement
   if (!el) {
     return
   }
-  const { scrollbarWidth, scrollbarHeight } = reactData
+  const { overflowX, scrollbarWidth, overflowY, scrollbarHeight } = reactData
   const { prevDragToChild } = internalData
   const wrapperRect = el.getBoundingClientRect()
+  const osbWidth = overflowY ? scrollbarWidth : 0
+  const osbHeight = overflowX ? scrollbarHeight : 0
   const tableWidth = el.clientWidth
   const tableHeight = el.clientHeight
   if (trEl) {
     const rdLineEl = $xeTable.$refs.refDragRowLineElem as HTMLElement
     if (rdLineEl) {
       if (showLine) {
+        const scrollbarYToLeft = $xeTable.computeScrollbarYToLeft
         const trRect = trEl.getBoundingClientRect()
         let trHeight = trEl.clientHeight
         const offsetTop = Math.max(1, trRect.y - wrapperRect.y)
-        if (offsetTop + trHeight > tableHeight - scrollbarHeight) {
-          trHeight = tableHeight - offsetTop - scrollbarHeight
+        if (offsetTop + trHeight > tableHeight - osbHeight) {
+          trHeight = tableHeight - offsetTop - osbHeight
         }
         rdLineEl.style.display = 'block'
+        rdLineEl.style.left = `${scrollbarYToLeft ? osbWidth : 0}px`
         rdLineEl.style.top = `${offsetTop}px`
         rdLineEl.style.height = `${trHeight}px`
-        rdLineEl.style.width = `${tableWidth - scrollbarWidth}px`
+        rdLineEl.style.width = `${tableWidth - osbWidth}px`
         rdLineEl.setAttribute('drag-pos', dragPos)
         rdLineEl.setAttribute('drag-to-child', prevDragToChild ? 'y' : 'n')
       } else {
@@ -1225,6 +1300,7 @@ function showDropTip ($xeTable: any, evnt: DragEvent | MouseEvent, trEl: HTMLEle
     const cdLineEl = $xeTable.$refs.refDragColLineElem as HTMLElement
     if (cdLineEl) {
       if (showLine) {
+        const scrollbarXToTop = $xeTable.computeScrollbarXToTop
         const leftContainerElem = $xeTable.$refs.refLeftContainer as HTMLDivElement
         const leftContainerWidth = leftContainerElem ? leftContainerElem.clientWidth : 0
         const rightContainerElem = $xeTable.$refs.refRightContainer as HTMLDivElement
@@ -1238,7 +1314,7 @@ function showDropTip ($xeTable: any, evnt: DragEvent | MouseEvent, trEl: HTMLEle
           thWidth -= startX - offsetLeft
           offsetLeft = startX
         }
-        const endX = tableWidth - rightContainerWidth - (rightContainerWidth ? 0 : scrollbarWidth)
+        const endX = tableWidth - rightContainerWidth - (rightContainerWidth ? 0 : osbWidth)
         if (offsetLeft + thWidth > endX) {
           thWidth = endX - offsetLeft
         }
@@ -1249,7 +1325,7 @@ function showDropTip ($xeTable: any, evnt: DragEvent | MouseEvent, trEl: HTMLEle
         if (prevDragToChild) {
           cdLineEl.style.height = `${thRect.height}px`
         } else {
-          cdLineEl.style.height = `${tableHeight - offsetTop - scrollbarHeight}px`
+          cdLineEl.style.height = `${tableHeight - offsetTop - (scrollbarXToTop ? 0 : osbHeight)}px`
         }
         cdLineEl.setAttribute('drag-pos', dragPos)
         cdLineEl.setAttribute('drag-to-child', prevDragToChild ? 'y' : 'n')
@@ -1267,7 +1343,7 @@ function showDropTip ($xeTable: any, evnt: DragEvent | MouseEvent, trEl: HTMLEle
   }
 }
 
-function hideDropTip ($xeTable: any) {
+function hideDropTip ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
   const rdTipEl = $xeTable.$refs.refDragTipElem as HTMLDivElement
   const rdLineEl = $xeTable.$refs.refDragRowLineElem as HTMLDivElement
   const cdLineEl = $xeTable.$refs.refDragColLineElem as HTMLDivElement
@@ -1282,7 +1358,44 @@ function hideDropTip ($xeTable: any) {
   }
 }
 
-function handleScrollToRowColumn ($xeTable: VxeTableConstructor, fieldOrColumn: string | VxeTableDefines.ColumnInfo | null, row?: any) {
+/**
+ * 处理显示 tooltip
+ * @param {Event} evnt 事件
+ * @param {Row} row 行对象
+ */
+function handleTooltip ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, evnt: MouseEvent, tdEl: HTMLTableCellElement, overflowElem: HTMLElement, tipElem: HTMLElement | null, params: any) {
+  const reactData = $xeTable as unknown as TableReactData
+
+  if (!overflowElem) {
+    return $xeTable.$nextTick()
+  }
+  params.cell = tdEl
+  const { tooltipStore } = reactData
+  const tooltipOpts = $xeTable.computeTooltipOpts
+  const { column, row } = params
+  const { showAll, contentMethod } = tooltipOpts
+  const customContent = contentMethod ? contentMethod(params) : null
+  const useCustom = contentMethod && !XEUtils.eqNull(customContent)
+  const content = useCustom ? customContent : XEUtils.toString(column.type === 'html' ? overflowElem.innerText : overflowElem.textContent).trim()
+  const isCellOverflow = overflowElem.scrollWidth > overflowElem.clientWidth
+  if (content && (showAll || useCustom || isCellOverflow)) {
+    Object.assign(tooltipStore, {
+      row,
+      column,
+      visible: true,
+      currOpts: {}
+    })
+    $xeTable.$nextTick(() => {
+      const $tooltip = $xeTable.$refs.refTooltip as VxeTooltipInstance
+      if ($tooltip && $tooltip.open) {
+        $tooltip.open(isCellOverflow ? overflowElem : (tipElem || overflowElem), formatText(content))
+      }
+    })
+  }
+  return $xeTable.$nextTick()
+}
+
+function handleScrollToRowColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, fieldOrColumn: string | VxeTableDefines.ColumnInfo | null, row?: any) {
   const internalData = $xeTable as unknown as TableInternalData
 
   const { fullColumnIdData } = internalData
@@ -1301,13 +1414,13 @@ function computeScrollLoad ($xeTable: VxeTableConstructor & VxeTablePrivateMetho
   return $xeTable.$nextTick().then(() => {
     const { scrollXLoad, scrollYLoad } = reactData
     const { scrollXStore, scrollYStore } = internalData
-    const sYOpts = $xeTable.computeSYOpts
-    const sXOpts = $xeTable.computeSXOpts
+    const virtualYOpts = $xeTable.computeVirtualYOpts
+    const virtualXOpts = $xeTable.computeVirtualXOpts
     // 计算 X 逻辑
     if (scrollXLoad) {
       const { toVisibleIndex: toXVisibleIndex, visibleSize: visibleXSize } = handleVirtualXVisible($xeTable)
-      const offsetXSize = Math.max(0, sXOpts.oSize ? XEUtils.toNumber(sXOpts.oSize) : 0)
-      scrollXStore.preloadSize = 4
+      const offsetXSize = Math.max(0, virtualXOpts.oSize ? XEUtils.toNumber(virtualXOpts.oSize) : 0)
+      scrollXStore.preloadSize = XEUtils.toNumber(virtualXOpts.preSize)
       scrollXStore.offsetSize = offsetXSize
       scrollXStore.visibleSize = visibleXSize
       scrollXStore.endIndex = Math.max(scrollXStore.startIndex + scrollXStore.visibleSize + offsetXSize, scrollXStore.endIndex)
@@ -1319,15 +1432,14 @@ function computeScrollLoad ($xeTable: VxeTableConstructor & VxeTablePrivateMetho
     } else {
       $xeTable.updateScrollXSpace()
     }
-    calcCellHeight($xeTable)
     // 计算 Y 逻辑
     const rowHeight = computeRowHeight($xeTable)
     ;(scrollYStore as any).rowHeight = rowHeight
     reactData.rowHeight = rowHeight
     const { toVisibleIndex: toYVisibleIndex, visibleSize: visibleYSize } = handleVirtualYVisible($xeTable)
     if (scrollYLoad) {
-      const offsetYSize = Math.max(0, sYOpts.oSize ? XEUtils.toNumber(sYOpts.oSize) : 0)
-      scrollYStore.preloadSize = 2
+      const offsetYSize = Math.max(0, virtualYOpts.oSize ? XEUtils.toNumber(virtualYOpts.oSize) : 0)
+      scrollYStore.preloadSize = XEUtils.toNumber(virtualYOpts.preSize)
       scrollYStore.offsetSize = offsetYSize
       scrollYStore.visibleSize = visibleYSize
       scrollYStore.endIndex = Math.max(scrollYStore.startIndex + visibleYSize + offsetYSize, scrollYStore.endIndex)
@@ -1355,12 +1467,14 @@ function handleRecalculateLayout ($xeTable: VxeTableConstructor & VxeTablePrivat
   }
   calcCellWidth($xeTable)
   autoCellWidth($xeTable)
+  updateStyle($xeTable)
   return computeScrollLoad($xeTable).then(() => {
     if (reFull === true) {
       // 初始化时需要在列计算之后再执行优化运算，达到最优显示效果
       calcCellHeight($xeTable)
       calcCellWidth($xeTable)
       autoCellWidth($xeTable)
+      updateStyle($xeTable)
       return computeScrollLoad($xeTable)
     }
   })
@@ -1615,7 +1729,7 @@ function handleColumn ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, c
 /**
  * 纵向 Y 可视渲染处理
  */
-function loadScrollYData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
+function loadScrollYData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, scrollTop?: number) {
   const props = $xeTable
   const reactData = $xeTable as unknown as TableReactData
   const internalData = $xeTable as unknown as TableInternalData
@@ -1625,7 +1739,7 @@ function loadScrollYData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods
   const { scrollYStore } = internalData
   const { preloadSize, startIndex, endIndex, offsetSize } = scrollYStore
   const autoOffsetYSize = showOverflow ? offsetSize : offsetSize + 1
-  const { toVisibleIndex, visibleSize } = handleVirtualYVisible($xeTable)
+  const { toVisibleIndex, visibleSize } = handleVirtualYVisible($xeTable, scrollTop)
   const offsetItem = {
     startIndex: Math.max(0, toVisibleIndex - 1 - offsetSize - preloadSize),
     endIndex: toVisibleIndex + visibleSize + autoOffsetYSize + preloadSize
@@ -1643,6 +1757,46 @@ function loadScrollYData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods
   }
 }
 
+function lazyScrollXData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
+  const internalData = $xeTable as unknown as TableInternalData
+
+  const { lxTimeout, lxRunTime, scrollXStore } = internalData
+  const { visibleSize } = scrollXStore
+  const fpsTime = Math.max(5, Math.min(10, Math.floor(visibleSize / 3)))
+  if (lxTimeout) {
+    clearTimeout(lxTimeout)
+  }
+  if (!lxRunTime || lxRunTime + fpsTime < Date.now()) {
+    internalData.lxRunTime = Date.now()
+    loadScrollXData($xeTable)
+  }
+  internalData.lxTimeout = setTimeout(() => {
+    internalData.lxTimeout = undefined
+    internalData.lxRunTime = undefined
+    loadScrollXData($xeTable)
+  }, fpsTime)
+}
+
+function lazyScrollYData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
+  const internalData = $xeTable as unknown as TableInternalData
+
+  const { lyTimeout, lyRunTime, scrollYStore } = internalData
+  const { visibleSize } = scrollYStore
+  const fpsTime = Math.floor(Math.max(4, Math.min(10, visibleSize / 3)))
+  if (lyTimeout) {
+    clearTimeout(lyTimeout)
+  }
+  if (!lyRunTime || lyRunTime + fpsTime < Date.now()) {
+    internalData.lyRunTime = Date.now()
+    loadScrollYData($xeTable)
+  }
+  internalData.lyTimeout = setTimeout(() => {
+    internalData.lyTimeout = undefined
+    internalData.lyRunTime = undefined
+    loadScrollYData($xeTable)
+  }, fpsTime)
+}
+
 function checkLastSyncScroll ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, isRollX: boolean, isRollY: boolean) {
   const reactData = $xeTable as unknown as TableReactData
   const internalData = $xeTable as unknown as TableInternalData
@@ -1655,28 +1809,66 @@ function checkLastSyncScroll ($xeTable: VxeTableConstructor & VxeTablePrivateMet
   internalData.lcsTimeout = setTimeout(() => {
     internalData.lcsRunTime = Date.now()
     internalData.lcsTimeout = undefined
+    internalData.intoRunScroll = false
     internalData.inVirtualScroll = false
     internalData.inWheelScroll = false
     internalData.inHeaderScroll = false
     internalData.inBodyScroll = false
     internalData.inFooterScroll = false
     internalData.scrollRenderType = ''
+    calcCellHeight($xeTable)
     if (isRollX && scrollXLoad) {
-      $xeTable.updateScrollXData().then(() => {
-        calcCellHeight($xeTable)
-        loadScrollXData($xeTable)
-      })
+      $xeTable.updateScrollXData()
     }
     if (isRollY && scrollYLoad) {
       $xeTable.updateScrollYData().then(() => {
         calcCellHeight($xeTable)
-        loadScrollYData($xeTable)
+        $xeTable.updateScrollYSpace()
       })
     }
     $xeTable.updateCellAreas()
   }, 200)
 }
 
+const getWheelSpeed = (lastScrollTime: number) => {
+  let multiple = 1
+  const currTime = Date.now()
+  if (lastScrollTime + 25 > currTime) {
+    multiple = 1.18
+  } else if (lastScrollTime + 30 > currTime) {
+    multiple = 1.15
+  } else if (lastScrollTime + 40 > currTime) {
+    multiple = 1.12
+  } else if (lastScrollTime + 55 > currTime) {
+    multiple = 1.09
+  } else if (lastScrollTime + 75 > currTime) {
+    multiple = 1.06
+  } else if (lastScrollTime + 100 > currTime) {
+    multiple = 1.03
+  }
+  return multiple
+}
+
+const wheelScrollTo = (diffNum: number, cb: (progress: number) => void) => {
+  const duration = Math.abs(diffNum)
+  const startTime = performance.now()
+  let countTop = 0
+  const step = (timestamp: number) => {
+    let progress = (timestamp - startTime) / duration
+    if (progress > 1) {
+      progress = 1
+    }
+    const easedProgress = Math.pow(progress, 2)
+    const offsetTop = Math.floor((diffNum * easedProgress)) - countTop
+    countTop += offsetTop
+    cb(offsetTop)
+    if (progress < 1) {
+      requestAnimationFrame(step)
+    }
+  }
+  requestAnimationFrame(step)
+}
+
 function updateHeight ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
   const internalData = $xeTable as unknown as TableInternalData
 
@@ -1686,57 +1878,63 @@ function updateHeight ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
 }
 
 function calcColumnAutoWidth (column: VxeTableDefines.ColumnInfo, wrapperEl: HTMLDivElement) {
-  const cellElList = wrapperEl.querySelectorAll(`.vxe-header--column.${column.id}>.vxe-cell,.vxe-body--column.${column.id}>.vxe-cell,.vxe-footer--column.${column.id}>.vxe-cell`)
-  const firstCellEl = cellElList[0]
-  let paddingSize = 0
-  if (firstCellEl) {
-    const cellStyle = getComputedStyle(firstCellEl)
-    paddingSize = Math.floor(XEUtils.toNumber(cellStyle.paddingLeft) + XEUtils.toNumber(cellStyle.paddingRight)) + 2
+  const cellElemList = wrapperEl.querySelectorAll(`.vxe-cell--wrapper[colid="${column.id}"]`)
+  let leftRightPadding = 0
+  const firstCellEl = cellElemList[0]
+  if (firstCellEl && firstCellEl.parentElement) {
+    const cellStyle = getComputedStyle(firstCellEl.parentElement)
+    leftRightPadding = Math.ceil(XEUtils.toNumber(cellStyle.paddingLeft) + XEUtils.toNumber(cellStyle.paddingRight))
   }
-  let colWidth = column.renderAutoWidth - paddingSize
-  XEUtils.arrayEach(cellElList, (itemEl) => {
-    const cellEl = itemEl as HTMLElement
-    const thElem = cellEl.parentElement as HTMLElement
-    let titleWidth = 0
-    if (`${thElem.tagName}`.toLowerCase() === 'th') {
-      XEUtils.arrayEach(cellEl.children, (btnEl) => {
-        titleWidth += (btnEl as HTMLElement).offsetWidth + 1
-      })
-    } else {
-      const labelEl = cellEl.firstElementChild as HTMLElement
-      if (labelEl) {
-        titleWidth = labelEl.offsetWidth
-      }
-    }
-    if (titleWidth) {
-      colWidth = Math.max(colWidth, Math.ceil(titleWidth) + 4)
-    }
-  })
-  return colWidth + paddingSize
+  let colWidth = column.renderAutoWidth - leftRightPadding
+  for (let i = 0; i < cellElemList.length; i++) {
+    const celEl = cellElemList[i] as HTMLDivElement
+    colWidth = Math.max(colWidth, celEl ? Math.ceil(celEl.scrollWidth) + 4 : 0)
+  }
+  return colWidth + leftRightPadding
 }
 
 function calcCellWidth ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
-  const reactData = $xeTable as unknown as TableReactData
   const internalData = $xeTable as unknown as TableInternalData
 
   const autoWidthColumnList = $xeTable.computeAutoWidthColumnList
-  reactData.isCalcColumn = true
-  return $xeTable.$nextTick().then(() => {
-    const { fullColumnIdData } = internalData
-    const el = $xeTable.$refs.refElem as HTMLDivElement
-    if (el) {
-      autoWidthColumnList.forEach(column => {
-        const colid = column.id
-        const colRest = fullColumnIdData[colid]
-        const colWidth = calcColumnAutoWidth(column, el)
-        if (colRest) {
-          colRest.width = Math.max(colWidth, colRest.width)
-        }
-        column.renderAutoWidth = colWidth
-      })
-      $xeTable.analyColumnWidth()
-    }
-    reactData.isCalcColumn = false
+  const { fullColumnIdData } = internalData
+  const el = $xeTable.$refs.refElem as HTMLDivElement
+  if (el) {
+    el.setAttribute('data-calc-col', 'Y')
+    autoWidthColumnList.forEach(column => {
+      const colid = column.id
+      const colRest = fullColumnIdData[colid]
+      const colWidth = calcColumnAutoWidth(column, el)
+      if (colRest) {
+        colRest.width = Math.max(colWidth, colRest.width)
+      }
+      column.renderAutoWidth = colWidth
+    })
+    $xeTable.analyColumnWidth()
+    el.removeAttribute('data-calc-col')
+  }
+}
+
+const handleUpdateColResize = ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, evnt: MouseEvent, params: any) => {
+  $xeTable.analyColumnWidth()
+  $xeTable.recalculate(true).then(() => {
+    $xeTable.saveCustomStore('update:width')
+    $xeTable.updateCellAreas()
+    $xeTable.dispatchEvent('column-resizable-change', params, evnt)
+    // 已废弃 resizable-change
+    $xeTable.dispatchEvent('resizable-change', params, evnt)
+    setTimeout(() => $xeTable.recalculate(true), 300)
+  })
+}
+
+const handleUpdateRowResize = ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, evnt: MouseEvent, params: any) => {
+  const reactData = $xeTable as unknown as TableReactData
+
+  reactData.resizeHeightFlag++
+  $xeTable.recalculate(true).then(() => {
+    $xeTable.updateCellAreas()
+    $xeTable.dispatchEvent('row-resizable-change', params, evnt)
+    setTimeout(() => $xeTable.recalculate(true), 300)
   })
 }
 
@@ -1793,7 +1991,7 @@ const Methods = {
     warnLog('vxe.error.delFunc', ['syncData', 'getData'])
     return this.$nextTick().then(() => {
       this.tableData = []
-      return this.$nextTick().then(() => this.loadTableData(this.tableFullData))
+      return this.$nextTick().then(() => this.loadTableData(this.tableFullData, true))
     })
   },
   /**
@@ -1848,8 +2046,9 @@ const Methods = {
    * 加载表格数据
    * @param {Array} datas 数据
    */
-  loadTableData (datas: any) {
-    const $xeTable = this
+  loadTableData (datas: any[], isReset: boolean) {
+    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const internalData = $xeTable as unknown as TableInternalData
 
     const { keepSource, showOverflow, treeConfig, treeOpts, editStore, scrollYStore, scrollXStore, lastScrollLeft, lastScrollTop, scrollYLoad: oldScrollYLoad, sXOpts, sYOpts } = this
     const childrenField = treeOpts.children || treeOpts.childrenField
@@ -1905,9 +2104,12 @@ const Methods = {
     this.tableFullData = fullData
     this.tableFullTreeData = treeData
     // 缓存数据
-    this.cacheRowMap(true)
+    this.cacheRowMap(isReset, true)
     // 原始数据
     this.tableSynchData = datas
+    if (isReset) {
+      internalData.isResizeCellHeight = false
+    }
     // 克隆原数据，用于显示编辑状态，与编辑值做对比
     if (keepSource) {
       this.cacheSourceMap(fullData)
@@ -1967,6 +2169,7 @@ const Methods = {
             if (sYOpts.scrollToTopOnChange) {
               targetScrollTop = 0
             }
+            calcCellHeight($xeTable)
             // 是否变更虚拟滚动
             if (oldScrollYLoad === sYLoad) {
               restoreScrollLocation(this, targetScrollLeft, targetScrollTop)
@@ -1991,7 +2194,7 @@ const Methods = {
    */
   loadData (datas: any) {
     const { initStatus } = this
-    return this.loadTableData(datas).then(() => {
+    return this.loadTableData(datas, false).then(() => {
       this.inited = true
       this.initStatus = true
       if (!initStatus) {
@@ -2009,7 +2212,7 @@ const Methods = {
       .then(() => {
         this.inited = true
         this.initStatus = true
-        return this.loadTableData(datas)
+        return this.loadTableData(datas, true)
       })
       .then(() => {
         this.handleLoadDefaults()
@@ -2087,9 +2290,8 @@ const Methods = {
   },
   /**
    * 更新数据行的 Map
-   * 牺牲数据组装的耗时，用来换取使用过程中的流畅
    */
-  cacheRowMap (isSource?: boolean) {
+  cacheRowMap (isReset: boolean, isSource?: boolean) {
     const { treeConfig, treeOpts, tableFullData, fullAllDataRowIdData, tableFullTreeData } = this
     const childrenField = treeOpts.children || treeOpts.childrenField
     const hasChildField = treeOpts.hasChild || treeOpts.hasChildField
@@ -2109,8 +2311,8 @@ const Methods = {
         row[childrenField] = null
       }
       let cacheItem = fullAllDataRowIdData[rowid]
-      if (!cacheItem) {
-        cacheItem = { row, rowid, seq, index: -1, _index: -1, $index: -1, items, parent: parentRow, level, height: 0, oTop: 0 }
+      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 = row
       cacheItem.items = items
@@ -2183,7 +2385,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, items, parent: parentRow, level: parentLevel + nodes.length, height: 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 }
         fullDataRowIdData[rowid] = rest
         fullAllDataRowIdData[rowid] = rest
       }, { children: childrenField })
@@ -2191,7 +2393,7 @@ const Methods = {
       if (transform) {
         row[mapChildrenField] = XEUtils.clone(rows, false)
       }
-      this.updateAfterDataIndex()
+      updateAfterDataIndex($xeTable)
       return rows
     })
   },
@@ -2534,18 +2736,37 @@ const Methods = {
     return this.$nextTick()
   },
   getCellElement (row: any, fieldOrColumn: any) {
-    const column = handleFieldOrColumn(this, fieldOrColumn)
+    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const internalData = $xeTable as unknown as TableInternalData
+
+    const { elemStore } = internalData
+    const column = handleFieldOrColumn($xeTable, fieldOrColumn)
     if (!column) {
       return null
     }
-    const { $refs } = this
-    const rowid = getRowid(this, row)
-    let bodyElem = null
+    const rowid = getRowid($xeTable, row)
+    const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
+    const leftScrollElem = getRefElem(elemStore['left-body-scroll'])
+    const rightScrollElem = getRefElem(elemStore['right-body-scroll'])
+    let bodyElem
     if (column) {
-      bodyElem = $refs[`${column.fixed || 'table'}Body`] || $refs.refTableBody
-    }
-    if (bodyElem && bodyElem.$el) {
-      return bodyElem.$el.querySelector(`.vxe-body--row[rowid="${rowid}"] .${column.id}`)
+      if (column.fixed) {
+        if (column.fixed === 'left') {
+          if (leftScrollElem) {
+            bodyElem = leftScrollElem
+          }
+        } else {
+          if (rightScrollElem) {
+            bodyElem = rightScrollElem
+          }
+        }
+      }
+      if (!bodyElem) {
+        bodyElem = bodyScrollElem
+      }
+      if (bodyElem) {
+        return bodyElem.querySelector(`.vxe-body--row[rowid="${rowid}"] .${column.id}`)
+      }
     }
     return null
   },
@@ -2746,6 +2967,8 @@ const Methods = {
    * 如果存在筛选条件，继续处理
    */
   updateAfterFullData () {
+    const $xeTable = this
+
     const { tableFullColumn, tableFullData, filterOpts, sortOpts, treeConfig, treeOpts, tableFullTreeData } = this
     const { remote: allRemoteFilter, filterMethod: allFilterMethod } = filterOpts
     const { remote: allRemoteSort, sortMethod: allSortMethod, multiple: sortMultiple, chronological } = sortOpts
@@ -2861,7 +3084,7 @@ const Methods = {
     }
     this.afterFullData = tableData
     this.afterTreeFullData = tableTree
-    this.updateAfterDataIndex()
+    updateAfterDataIndex($xeTable)
   },
   /**
    * 预编译
@@ -2869,46 +3092,8 @@ const Methods = {
    */
   updateAfterDataIndex () {
     const $xeTable = this
-    const props = $xeTable
-    const internalData = $xeTable
 
-    const { treeConfig } = props
-    const { afterFullData, fullDataRowIdData, fullAllDataRowIdData, afterTreeFullData } = internalData
-    const treeOpts = $xeTable.computeTreeOpts
-    const childrenField = treeOpts.children || treeOpts.childrenField
-    const fullMaps: any = {}
-    if (treeConfig) {
-      XEUtils.eachTree(afterTreeFullData, (row, index, items, path) => {
-        const rowid = getRowid($xeTable, row)
-        const rowRest = fullAllDataRowIdData[rowid]
-        const seq = path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('')
-        if (rowRest) {
-          rowRest.seq = seq
-          rowRest._index = index
-        } else {
-          const rest = { row, rowid, seq, index: -1, $index: -1, _index: index, items: [], parent: null, level: 0, height: 0, oTop: 0 }
-          fullAllDataRowIdData[rowid] = rest
-          fullDataRowIdData[rowid] = rest
-        }
-        fullMaps[rowid] = row
-      }, { children: treeOpts.transform ? treeOpts.mapChildrenField : childrenField })
-    } else {
-      afterFullData.forEach((row: any, index: number) => {
-        const rowid = getRowid($xeTable, row)
-        const rowRest = fullAllDataRowIdData[rowid]
-        const seq = index + 1
-        if (rowRest) {
-          rowRest.seq = seq
-          rowRest._index = index
-        } else {
-          const rest = { row, rowid, seq, index: -1, $index: -1, _index: index, items: [], parent: null, level: 0, height: 0, oTop: 0 }
-          fullAllDataRowIdData[rowid] = rest
-          fullDataRowIdData[rowid] = rest
-        }
-        fullMaps[rowid] = row
-      })
-    }
-    this.afterFullRowMaps = fullMaps
+    updateAfterDataIndex($xeTable)
   },
   /**
    * 只对 tree-config 有效，获取行的子级
@@ -2975,7 +3160,10 @@ const Methods = {
    * @param {String/Number} rowid 行主键
    */
   getRowById (cellValue: any) {
-    const fullDataRowIdData = this.fullDataRowIdData
+    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const internalData = $xeTable as unknown as TableInternalData
+
+    const { fullDataRowIdData } = internalData
     const rowid = XEUtils.eqNull(cellValue) ? '' : encodeURIComponent(cellValue)
     return fullDataRowIdData[rowid] ? fullDataRowIdData[rowid].row : null
   },
@@ -2983,13 +3171,10 @@ const Methods = {
    * 根据行获取行的唯一主键
    * @param {Row} row 行对象
    */
-  getRowid (cellValue: any) {
+  getRowid (row: any) {
     const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
-    const internalData = $xeTable as unknown as TableInternalData
 
-    const { fullDataRowIdData } = internalData
-    const rowid = XEUtils.eqNull(cellValue) ? '' : encodeURIComponent(cellValue || '')
-    return fullDataRowIdData[rowid] ? fullDataRowIdData[rowid].row : null
+    return getRowid($xeTable, row)
   },
   /**
    * 获取处理后的表格数据
@@ -3180,34 +3365,40 @@ const Methods = {
     }
     return $xeTable.$nextTick()
   },
-  setColumnWidth (fieldOrColumn: any, width: any) {
-    const $xeTable = this
+  setColumnWidth (fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo | VxeColumnPropTypes.Field[] | VxeTableDefines.ColumnInfo[], width: number | string) {
+    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const internalData = $xeTable as unknown as TableInternalData
 
+    const { elemStore } = internalData
     let status = false
     const cols = XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : [fieldOrColumn]
-    cols.forEach(item => {
-      const column = handleFieldOrColumn($xeTable, item)
-      if (column) {
-        const colWidth = XEUtils.toInteger(width)
-        let rdWidth = colWidth
-        if (isScale(width)) {
-          const refTableBody = $xeTable.$refs.refTableBody
-          const bodyElem = refTableBody ? refTableBody.$el as HTMLDivElement : null
-          const bodyWidth = bodyElem ? bodyElem.clientWidth - 1 : 0
-          rdWidth = Math.floor(colWidth * bodyWidth)
-        }
-        column.resizeWidth = rdWidth
-        if (!status) {
-          status = true
+    let cWidth = XEUtils.toInteger(width)
+    if (isScale(width)) {
+      const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
+      const bodyWidth = bodyScrollElem ? bodyScrollElem.clientWidth - 1 : 0
+      cWidth = Math.floor(cWidth * bodyWidth)
+    }
+    if (cWidth) {
+      cols.forEach(item => {
+        const column = handleFieldOrColumn($xeTable, item)
+        if (column) {
+          column.resizeWidth = cWidth
+          if (!status) {
+            status = true
+          }
         }
+      })
+      if (status) {
+        return $xeTable.refreshColumn().then(() => {
+          return { status }
+        })
       }
-    })
-    if (status) {
-      return $xeTable.refreshColumn()
     }
-    return $xeTable.$nextTick()
+    return $xeTable.$nextTick().then(() => {
+      return { status }
+    })
   },
-  getColumnWidth (fieldOrColumn: any) {
+  getColumnWidth (fieldOrColumn: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo) {
     const column = handleFieldOrColumn(this, fieldOrColumn)
     if (column) {
       return column.renderWidth
@@ -3219,7 +3410,12 @@ const Methods = {
    * 如果为 true 则重置所有状态
    * 如果已关联工具栏，则会同步更新
    */
-  resetColumn (options: any) {
+  resetColumn (options?: boolean | {
+    visible?: boolean
+    resizable?: boolean
+    fixed?: boolean
+    order?: boolean
+  }) {
     warnLog('vxe.error.delFunc', ['resetColumn', 'resetCustom'])
     return this.resetCustom(options)
   },
@@ -3492,7 +3688,149 @@ const Methods = {
     })
     Object.assign(this.columnStore, { resizeList, pxList, pxMinList, autoMinList, scaleList, scaleMinList, autoList, remainList })
   },
-  handleResizeDblclickEvent (evnt: MouseEvent, params: VxeTableDefines.CellRenderHeaderParams) {
+  handleColResizeMousedownEvent (evnt: MouseEvent, fixedType: 'left' | 'right' | '', params: VxeTableDefines.CellRenderHeaderParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
+    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const reactData = $xeTable as unknown as TableReactData
+    const internalData = $xeTable as unknown as TableInternalData
+
+    evnt.stopPropagation()
+    evnt.preventDefault()
+    const { column } = params
+    const { overflowX, scrollbarHeight } = reactData
+    const { elemStore, visibleColumn } = internalData
+    const resizableOpts = $xeTable.computeResizableOpts
+    const osbHeight = overflowX ? scrollbarHeight : 0
+    const tableEl = $xeTable.$refs.refElem as HTMLDivElement
+    const leftContainerElem = $xeTable.$refs.refLeftContainer as HTMLDivElement
+    const rightContainerElem = $xeTable.$refs.refRightContainer as HTMLDivElement
+    const resizeBarElem = $xeTable.$refs.refColResizeBar as HTMLDivElement
+    if (!resizeBarElem) {
+      return
+    }
+    const resizeTipElem = resizeBarElem.firstElementChild as HTMLDivElement
+    const scrollbarXToTop = $xeTable.computeScrollbarXToTop
+    const { clientX: dragClientX } = evnt
+    const wrapperElem = $xeTable.$refs.refElem as HTMLDivElement
+    const dragBtnElem = evnt.target as HTMLDivElement
+    let resizeColumn = column
+    if (column.children && column.children.length) {
+      XEUtils.eachTree(column.children, childColumn => {
+        resizeColumn = childColumn
+      })
+    }
+    const cell = dragBtnElem.parentNode as HTMLTableCellElement
+    const cellParams = Object.assign(params, { cell })
+    let dragLeft = 0
+    const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
+    if (!bodyScrollElem) {
+      return
+    }
+    const pos = getOffsetPos(dragBtnElem, wrapperElem)
+    const dragBtnWidth = dragBtnElem.clientWidth
+    const dragBtnOffsetWidth = Math.floor(dragBtnWidth / 2)
+    const minInterval = getColReMinWidth(cellParams) - dragBtnOffsetWidth // 列之间的最小间距
+    let dragMinLeft = pos.left - cell.clientWidth + dragBtnWidth + minInterval
+    let dragPosLeft = pos.left + dragBtnOffsetWidth
+    const isLeftFixed = fixedType === 'left'
+    const isRightFixed = fixedType === 'right'
+
+    // 计算左右侧固定列偏移量
+    let fixedOffsetWidth = 0
+    if (isLeftFixed || isRightFixed) {
+      const siblingProp = isLeftFixed ? 'nextElementSibling' : 'previousElementSibling'
+      let tempCellElem = cell[siblingProp] as HTMLTableCellElement
+      while (tempCellElem) {
+        if (hasClass(tempCellElem, 'fixed--hidden')) {
+          break
+        } else if (!hasClass(tempCellElem, 'col--group')) {
+          fixedOffsetWidth += tempCellElem.offsetWidth
+        }
+        tempCellElem = tempCellElem[siblingProp] as HTMLTableCellElement
+      }
+      if (isRightFixed && rightContainerElem) {
+        dragPosLeft = rightContainerElem.offsetLeft + fixedOffsetWidth
+      }
+    }
+
+    // 处理拖动事件
+    const updateEvent = (evnt: MouseEvent) => {
+      evnt.stopPropagation()
+      evnt.preventDefault()
+      const tableHeight = tableEl.clientHeight
+      const offsetX = evnt.clientX - dragClientX
+      let left = dragPosLeft + offsetX
+      const scrollLeft = fixedType ? 0 : bodyScrollElem.scrollLeft
+      if (isLeftFixed) {
+      // 左固定列（不允许超过右侧固定列、不允许超过右边距）
+        left = Math.min(left, (rightContainerElem ? rightContainerElem.offsetLeft : bodyScrollElem.clientWidth) - fixedOffsetWidth - minInterval)
+      } else if (isRightFixed) {
+      // 右侧固定列（不允许超过左侧固定列、不允许超过左边距）
+        dragMinLeft = (leftContainerElem ? leftContainerElem.clientWidth : 0) + fixedOffsetWidth + minInterval
+        left = Math.min(left, dragPosLeft + cell.clientWidth - minInterval)
+      } else {
+        dragMinLeft = Math.max(bodyScrollElem.scrollLeft, dragMinLeft)
+      // left = Math.min(left, bodyScrollElem.clientWidth + bodyScrollElem.scrollLeft - 40)
+      }
+      dragLeft = Math.max(left, dragMinLeft)
+      const resizeBarLeft = Math.max(1, dragLeft - scrollLeft)
+      resizeBarElem.style.left = `${resizeBarLeft}px`
+      resizeBarElem.style.top = `${scrollbarXToTop ? osbHeight : 0}px`
+      resizeBarElem.style.height = `${scrollbarXToTop ? tableHeight - osbHeight : tableHeight}px`
+      if (resizableOpts.showDragTip && resizeTipElem) {
+        resizeTipElem.textContent = getI18n('vxe.table.resizeColTip', [resizeColumn.renderWidth + (isRightFixed ? dragPosLeft - dragLeft : dragLeft - dragPosLeft)])
+        const tableWidth = tableEl.clientWidth
+        const wrapperRect = wrapperElem.getBoundingClientRect()
+        const resizeBarWidth = resizeBarElem.clientWidth
+        const resizeTipWidth = resizeTipElem.clientWidth
+        const resizeTipHeight = resizeTipElem.clientHeight
+        let resizeTipLeft = -resizeTipWidth
+        if (resizeBarLeft < resizeTipWidth + resizeBarWidth) {
+          resizeTipLeft = 0
+        } else if (resizeBarLeft > tableWidth) {
+          resizeTipLeft += tableWidth - resizeBarLeft
+        }
+        resizeTipElem.style.left = `${resizeTipLeft}px`
+        resizeTipElem.style.top = `${Math.min(tableHeight - resizeTipHeight, Math.max(0, evnt.clientY - wrapperRect.y - resizeTipHeight / 2))}px`
+      }
+    }
+
+    reactData.isDragResize = true
+    addClass(tableEl, 'col-drag--resize')
+    resizeBarElem.style.display = 'block'
+    document.onmousemove = updateEvent
+    document.onmouseup = function (evnt) {
+      document.onmousemove = null
+      document.onmouseup = null
+      resizeBarElem.style.display = 'none'
+      reactData.isDragResize = false
+      internalData._lastResizeTime = Date.now()
+
+      const resizeWidth = resizeColumn.renderWidth + (isRightFixed ? dragPosLeft - dragLeft : dragLeft - dragPosLeft)
+      const resizeParams = { ...params, resizeWidth, resizeColumn }
+      if (resizableOpts.dragMode === 'fixed') {
+        visibleColumn.forEach(item => {
+          if (item.id !== resizeColumn.id) {
+            if (!item.resizeWidth) {
+              item.resizeWidth = item.renderWidth
+            }
+          }
+        })
+      }
+
+      if ($xeTable.handleColResizeCellAreaEvent) {
+        $xeTable.handleColResizeCellAreaEvent(evnt, resizeParams)
+      } else {
+        resizeColumn.resizeWidth = resizeWidth
+        handleUpdateColResize($xeTable, evnt, resizeParams)
+      }
+      removeClass(tableEl, 'col-drag--resize')
+    }
+    updateEvent(evnt)
+    if ($xeTable.closeMenu) {
+      $xeTable.closeMenu()
+    }
+  },
+  handleColResizeDblclickEvent (evnt: MouseEvent, params: VxeTableDefines.CellRenderHeaderParams) {
     const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
     const reactData = $xeTable as unknown as TableReactData
     const internalData = $xeTable as unknown as TableInternalData
@@ -3503,27 +3841,266 @@ const Methods = {
     if (isDblclickAutoWidth && el) {
       const { fullColumnIdData } = internalData
       const { column } = params
-      const colid = column.id
+      let resizeColumn = column
+      if (column.children && column.children.length) {
+        XEUtils.eachTree(column.children, childColumn => {
+          resizeColumn = childColumn
+        })
+      }
+      const colid = resizeColumn.id
       const colRest = fullColumnIdData[colid]
       const dragBtnElem = evnt.target as HTMLDivElement
       const cell = dragBtnElem.parentNode as HTMLTableCellElement
       const cellParams = Object.assign(params, { cell })
       const colMinWidth = getColReMinWidth(cellParams)
-      let resizeWidth = calcColumnAutoWidth(column, el)
+
+      el.setAttribute('data-calc-col', 'Y')
+      let resizeWidth = calcColumnAutoWidth(resizeColumn, el)
+      el.removeAttribute('data-calc-col')
       if (colRest) {
         resizeWidth = Math.max(resizeWidth, colRest.width)
       }
-      column.resizeWidth = Math.max(colMinWidth, resizeWidth)
-      reactData._isResize = false
+      resizeWidth = Math.max(colMinWidth, resizeWidth)
+      const resizeParams = { ...params, resizeWidth, resizeColumn }
+      reactData.isDragResize = false
       internalData._lastResizeTime = Date.now()
-      $xeTable.analyColumnWidth()
-      $xeTable.recalculate(true).then(() => {
-        $xeTable.saveCustomStore('update:visible')
-        $xeTable.updateCellAreas()
-        $xeTable.dispatchEvent('resizable-change', { ...params, resizeWidth }, evnt)
-        setTimeout(() => $xeTable.recalculate(true), 300)
+
+      if ($xeTable.handleColResizeDblclickCellAreaEvent) {
+        $xeTable.handleColResizeDblclickCellAreaEvent(evnt, resizeParams)
+      } else {
+        resizeColumn.resizeWidth = resizeWidth
+        handleUpdateColResize($xeTable, evnt, resizeParams)
+      }
+    }
+  },
+  handleRowResizeMousedownEvent (evnt: MouseEvent, params: VxeTableDefines.CellRenderBodyParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
+    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const reactData = $xeTable as unknown as TableReactData
+    const internalData = $xeTable as unknown as TableInternalData
+
+    evnt.stopPropagation()
+    evnt.preventDefault()
+    const { row } = params
+    const { overflowX, scrollbarWidth, overflowY, scrollbarHeight } = reactData
+    const { elemStore, fullAllDataRowIdData } = internalData
+    const osbWidth = overflowY ? scrollbarWidth : 0
+    const osbHeight = overflowX ? scrollbarHeight : 0
+    const scrollbarYToLeft = $xeTable.computeScrollbarYToLeft
+    const resizableOpts = $xeTable.computeResizableOpts
+    const rowOpts = $xeTable.computeRowOpts
+    const cellOpts = $xeTable.computeCellOpts
+    const tableEl = $xeTable.$refs.refElem as HTMLDivElement
+    const resizeBarElem = $xeTable.$refs.refRowResizeBar as HTMLDivElement
+    if (!resizeBarElem) {
+      return
+    }
+    const { clientY: dragClientY } = evnt
+    const resizeTipElem = resizeBarElem.firstElementChild as HTMLDivElement
+    const dragBtnElem = evnt.currentTarget as HTMLDivElement
+    const tdEl = dragBtnElem.parentNode as HTMLTableCellElement
+    const trEl = tdEl.parentNode as HTMLTableCellElement
+    const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
+    if (!bodyScrollElem) {
+      return
+    }
+    const rowid = getRowid($xeTable, row)
+    const rowRest = fullAllDataRowIdData[rowid]
+    if (!rowRest) {
+      return
+    }
+    const defaultRowHeight = $xeTable.computeDefaultRowHeight
+    const currCellHeight = rowRest.resizeHeight || cellOpts.height || rowOpts.height || defaultRowHeight
+    const tableRect = tableEl.getBoundingClientRect()
+    const trRect = trEl.getBoundingClientRect()
+    const targetOffsetY = dragClientY - trRect.y - trEl.clientHeight
+    let resizeHeight = currCellHeight
+    const cellEl = tdEl.querySelector('.vxe-cell')
+    let cellMinHeight = 0
+    if (cellEl) {
+      const cellStyle = getComputedStyle(cellEl)
+      cellMinHeight = Math.max(1, Math.ceil(XEUtils.toNumber(cellStyle.paddingTop) + XEUtils.toNumber(cellStyle.paddingBottom)))
+    }
+    const minTop = trRect.y - tableRect.y + cellMinHeight
+    // 处理拖动事件
+    const updateEvent = (evnt: MouseEvent) => {
+      evnt.stopPropagation()
+      evnt.preventDefault()
+      const tableWidth = tableEl.clientWidth - osbWidth
+      const tableHeight = tableEl.clientHeight - osbHeight
+      let dragTop = evnt.clientY - tableRect.y - targetOffsetY
+      if (dragTop < minTop) {
+        dragTop = minTop
+      } else {
+        resizeHeight = Math.max(cellMinHeight, currCellHeight + evnt.clientY - dragClientY)
+      }
+      resizeBarElem.style.left = `${scrollbarYToLeft ? osbWidth : 0}px`
+      resizeBarElem.style.top = `${dragTop}px`
+      resizeBarElem.style.width = `${tableWidth}px`
+      if (resizableOpts.showDragTip && resizeTipElem) {
+        resizeTipElem.textContent = getI18n('vxe.table.resizeRowTip', [resizeHeight])
+        const resizeTipWidth = resizeTipElem.clientWidth
+        const resizeTipHeight = resizeTipElem.clientHeight
+        let resizeBarLeft = Math.max(2, evnt.clientX - tableRect.x)
+        let resizeBarTop = 0
+        if (resizeBarLeft + resizeTipWidth >= tableWidth - 2) {
+          resizeBarLeft = tableWidth - resizeTipWidth - 2
+        }
+        if (dragTop + resizeTipHeight >= tableHeight) {
+          resizeBarTop = tableHeight - (dragTop + resizeTipHeight)
+        }
+        resizeTipElem.style.left = `${resizeBarLeft}px`
+        resizeTipElem.style.top = `${resizeBarTop}px`
+      }
+    }
+
+    reactData.isDragResize = true
+    addClass(tableEl, 'row-drag--resize')
+    resizeBarElem.style.display = 'block'
+    document.onmousemove = updateEvent
+    document.onmouseup = function (evnt) {
+      document.onmousemove = null
+      document.onmouseup = null
+      resizeBarElem.style.display = 'none'
+      reactData.isDragResize = false
+      internalData._lastResizeTime = Date.now()
+      if (resizeHeight !== currCellHeight) {
+        const resizeParams = { ...params, resizeHeight, resizeRow: row }
+        internalData.isResizeCellHeight = true
+        if ($xeTable.handleRowResizeCellAreaEvent) {
+          $xeTable.handleRowResizeCellAreaEvent(evnt, resizeParams)
+        } else {
+          rowRest.resizeHeight = resizeHeight
+          handleUpdateRowResize($xeTable, evnt, resizeParams)
+        }
+      }
+      removeClass(tableEl, 'row-drag--resize')
+    }
+    updateEvent(evnt)
+  },
+  handleRowResizeDblclickEvent (evnt: MouseEvent, params: VxeTableDefines.CellRenderBodyParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
+    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const reactData = $xeTable as unknown as TableReactData
+    const internalData = $xeTable as unknown as TableInternalData
+
+    const resizableOpts = $xeTable.computeResizableOpts
+    const { isDblclickAutoHeight } = resizableOpts
+    const el = $xeTable.$refs.refElem as HTMLDivElement
+    if (isDblclickAutoHeight && el) {
+      const { fullAllDataRowIdData } = internalData
+      const { row } = params
+      const rowid = getRowid($xeTable, row)
+      const rowRest = fullAllDataRowIdData[rowid]
+      if (!rowRest) {
+        return
+      }
+      const resizeHeight = calcCellAutoHeight(rowRest, el)
+      const resizeParams = { ...params, resizeHeight, resizeRow: row }
+      reactData.isDragResize = false
+      internalData._lastResizeTime = Date.now()
+      if ($xeTable.handleRowResizeDblclickCellAreaEvent) {
+        $xeTable.handleRowResizeDblclickCellAreaEvent(evnt, resizeParams)
+      } else {
+        rowRest.resizeHeight = resizeHeight
+        handleUpdateRowResize($xeTable, evnt, resizeParams)
+      }
+    }
+  },
+  setRowHeightConf (heightConf: Record<string, number>) {
+    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const reactData = $xeTable as unknown as TableReactData
+    const internalData = $xeTable as unknown as TableInternalData
+
+    const { fullAllDataRowIdData } = internalData
+    let status = false
+    if (heightConf) {
+      XEUtils.each(heightConf, (height, rowid) => {
+        const rowRest = fullAllDataRowIdData[rowid]
+        if (rowRest) {
+          const rHeight = XEUtils.toInteger(height)
+          if (rHeight) {
+            rowRest.resizeHeight = rHeight
+            if (!status) {
+              status = true
+            }
+          }
+        }
       })
+      if (status) {
+        internalData.isResizeCellHeight = true
+        reactData.resizeHeightFlag++
+      }
     }
+    return $xeTable.$nextTick().then(() => {
+      return { status }
+    })
+  },
+  getRowHeightConf (isFull?: boolean) {
+    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const internalData = $xeTable as unknown as TableInternalData
+
+    const { fullAllDataRowIdData, afterFullData } = internalData
+    const rowOpts = $xeTable.computeRowOpts
+    const cellOpts = $xeTable.computeCellOpts
+    const defaultRowHeight = $xeTable.computeDefaultRowHeight
+    const rest: Record<string, number> = {}
+    afterFullData.forEach(row => {
+      const rowid = getRowid($xeTable, row)
+      const rowRest = fullAllDataRowIdData[rowid]
+      if (rowRest) {
+        const resizeHeight = rowRest.resizeHeight
+        if (resizeHeight || isFull) {
+          const currCellHeight = resizeHeight || cellOpts.height || rowOpts.height || defaultRowHeight
+          rest[rowid] = currCellHeight
+        }
+      }
+    })
+    return rest
+  },
+  setRowHeight (rowOrId: any | any[], height: number) {
+    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const reactData = $xeTable as unknown as TableReactData
+    const internalData = $xeTable as unknown as TableInternalData
+
+    const { fullAllDataRowIdData } = internalData
+    let status = false
+    const rows = XEUtils.isArray(rowOrId) ? rowOrId : [rowOrId]
+    let rHeight = XEUtils.toInteger(height)
+    if (isScale(height)) {
+      const tableBody = $xeTable.$refs.refTableBody
+      const bodyElem = tableBody ? (tableBody as any).$el as HTMLDivElement : null
+      const bodyHeight = bodyElem ? bodyElem.clientHeight - 1 : 0
+      rHeight = Math.floor(rHeight * bodyHeight)
+    }
+    if (rHeight) {
+      rows.forEach(row => {
+        const rowid = XEUtils.isString(row) || XEUtils.isNumber(row) ? row : getRowid($xeTable, row)
+        const rowRest = fullAllDataRowIdData[rowid]
+        if (rowRest) {
+          rowRest.resizeHeight = rHeight
+          if (!status) {
+            status = true
+          }
+        }
+      })
+      if (status) {
+        internalData.isResizeCellHeight = true
+        reactData.resizeHeightFlag++
+      }
+    }
+    return $xeTable.$nextTick()
+  },
+  getRowHeight (rowOrId: any) {
+    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const internalData = $xeTable as unknown as TableInternalData
+
+    const { fullAllDataRowIdData } = internalData
+    const rowOpts = $xeTable.computeRowOpts
+    const cellOpts = $xeTable.computeCellOpts
+    const defaultRowHeight = $xeTable.computeDefaultRowHeight
+    const rowid = XEUtils.isString(rowOrId) || XEUtils.isNumber(rowOrId) ? rowOrId : getRowid($xeTable, rowOrId)
+    const rowRest = fullAllDataRowIdData[rowid]
+    const currCellHeight = rowRest ? rowRest.resizeHeight : (cellOpts.height || rowOpts.height || defaultRowHeight)
+    return currCellHeight
   },
   /**
    * 刷新滚动操作，手动同步滚动相关位置（对于某些特殊的操作，比如滚动条错位、固定列不同步）
@@ -3901,10 +4478,10 @@ const Methods = {
           }
         } else if (isContextMenu) {
           // 如果按下上下文键
-          this._keyCtx = selected.row && selected.column && bodyCtxMenu.length
+          internalData._keyCtx = selected.row && selected.column && bodyCtxMenu.length
           clearTimeout(internalData.keyCtxTimeout)
           internalData.keyCtxTimeout = setTimeout(() => {
-            this._keyCtx = false
+            internalData._keyCtx = false
           }, 1000)
         } else if (isEnter && !hasAltKey && keyboardConfig && keyboardOpts.isEnter && (selected.row || actived.row || (treeConfig && (rowOpts.isCurrent || highlightCurrentRow) && currentRow))) {
           const { isLastEnterAppendRow, beforeEnterMethod, enterMethod } = keyboardOpts
@@ -4136,17 +4713,6 @@ const Methods = {
     this.updateCellAreas()
     this.recalculate(true)
   },
-  handleTargetEnterEvent (isClear: any) {
-    const $tooltip = this.$refs.tooltip
-    clearTimeout(this.tooltipTimeout)
-    if (isClear) {
-      this.closeTooltip()
-    } else {
-      if ($tooltip) {
-        $tooltip.setActived(true)
-      }
-    }
-  },
   handleTargetLeaveEvent () {
     const tooltipOpts = this.tooltipOpts
     let $tooltip = this.$refs.tooltip
@@ -4165,19 +4731,22 @@ const Methods = {
     }
   },
   triggerHeaderTitleEvent (evnt: any, iconParams: any, params: any) {
-    const tipContent = iconParams.content || iconParams.message
+    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const reactData = $xeTable as unknown as TableReactData
+
+    const tipContent = iconParams.content || (iconParams as any).message
     if (tipContent) {
-      const { $refs, tooltipStore } = this
+      const { tooltipStore } = reactData
       const { column } = params
       const content = getFuncText(tipContent)
-      this.handleTargetEnterEvent(true)
+      handleTargetEnterEvent($xeTable, true)
       tooltipStore.row = null
       tooltipStore.column = column
       tooltipStore.visible = true
       tooltipStore.currOpts = iconParams
-      this.$nextTick(() => {
-        const $tooltip = $refs.tooltip
-        if ($tooltip) {
+      $xeTable.$nextTick(() => {
+        const $tooltip = $xeTable.$refs.refTooltip as VxeTooltipInstance
+        if ($tooltip && $tooltip.open) {
           $tooltip.open(evnt.currentTarget, content)
         }
       })
@@ -4187,23 +4756,44 @@ const Methods = {
    * 触发表头 tooltip 事件
    */
   triggerHeaderTooltipEvent (evnt: any, params: any) {
-    const { tooltipStore } = this
+    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const reactData = $xeTable as unknown as TableReactData
+
+    const { tooltipStore } = reactData
     const { column } = params
-    const titleElem = evnt.currentTarget
-    this.handleTargetEnterEvent(tooltipStore.column !== column || tooltipStore.row)
+    handleTargetEnterEvent($xeTable, true)
+    const titleElem = evnt.currentTarget as HTMLDivElement
+    if (!titleElem) {
+      return
+    }
+    const cellEl = titleElem.parentElement as HTMLDivElement
+    if (!cellEl) {
+      return
+    }
+    const thEl = cellEl.parentElement as HTMLTableCellElement
+    if (!thEl) {
+      return
+    }
     if (tooltipStore.column !== column || !tooltipStore.visible) {
-      this.handleTooltip(evnt, titleElem, titleElem, null, params)
+      handleTooltip($xeTable, evnt, thEl, cellEl, null, params)
     }
   },
   /**
    * 触发单元格 tooltip 事件
    */
   triggerBodyTooltipEvent (evnt: any, params: any) {
-    const { editConfig, editOpts, editStore, tooltipStore } = this
+    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const props = $xeTable
+    const reactData = $xeTable as unknown as TableReactData
+
+    const { editConfig } = props
+    const { editStore } = reactData
+    const { tooltipStore } = reactData
+    const editOpts = $xeTable.computeEditOpts
     const { actived } = editStore
     const { row, column } = params
-    const cell = evnt.currentTarget
-    this.handleTargetEnterEvent(tooltipStore.column !== column || tooltipStore.row !== row)
+    const tdEl = evnt.currentTarget as HTMLTableCellElement
+    handleTargetEnterEvent($xeTable, tooltipStore.column !== column || tooltipStore.row !== row)
     // 单元格处于编辑状态时不触发提示框
     if (column.editRender && isEnableConf(editConfig)) {
       // 如果是行编辑模式
@@ -4216,67 +4806,24 @@ const Methods = {
       }
     }
     if (tooltipStore.column !== column || tooltipStore.row !== row || !tooltipStore.visible) {
-      let overflowElem
-      let tipElem
-      if (column.treeNode) {
-        overflowElem = cell.querySelector('.vxe-tree-cell')
-        if (column.type === 'html') {
-          tipElem = cell.querySelector('.vxe-cell--html')
-        }
-      } else {
-        tipElem = cell.querySelector(column.type === 'html' ? '.vxe-cell--html' : '.vxe-cell--label')
-      }
-      this.handleTooltip(evnt, cell, overflowElem || cell.children[0], tipElem, params)
+      handleTooltip($xeTable, evnt, tdEl, tdEl.querySelector('.vxe-cell--wrapper') as HTMLElement, null, params)
     }
   },
   /**
    * 触发表尾 tooltip 事件
    */
   triggerFooterTooltipEvent (evnt: any, params: any) {
+    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const reactData = $xeTable as unknown as TableReactData
+
     const { column } = params
-    const { tooltipStore } = this
-    const cell = evnt.currentTarget
-    this.handleTargetEnterEvent(true)
+    const { tooltipStore } = reactData
+    const cell = evnt.currentTarget as HTMLTableCellElement
+    handleTargetEnterEvent($xeTable, tooltipStore.column !== column || !!tooltipStore.row)
     if (tooltipStore.column !== column || !tooltipStore.visible) {
-      this.handleTooltip(evnt, cell, cell.querySelector('.vxe-cell--item') || cell.children[0], null, params)
+      handleTooltip($xeTable, evnt, cell, cell.querySelector('.vxe-cell--wrapper') as HTMLElement || cell.children[0], null, params)
     }
   },
-  /**
-   * 处理显示 tooltip
-   * @param {Event} evnt 事件
-   * @param {ColumnInfo} column 列配置
-   * @param {Row} row 行对象
-   */
-  handleTooltip (evnt: any, cell: any, overflowElem: any, tipElem: any, params: any) {
-    const $xeTable = this
-
-    if (!overflowElem) {
-      return $xeTable.$nextTick()
-    }
-    params.cell = cell
-    const { $refs, tooltipOpts, tooltipStore } = this
-    const { column, row } = params
-    const { showAll, enabled, contentMethod } = tooltipOpts
-    const customContent = contentMethod ? contentMethod(params) : null
-    const useCustom = contentMethod && !XEUtils.eqNull(customContent)
-    const content = useCustom ? customContent : (column.type === 'html' ? overflowElem.innerText : overflowElem.textContent).trim()
-    const isCellOverflow = overflowElem.scrollWidth > overflowElem.clientWidth
-    if (content && (showAll || enabled || useCustom || isCellOverflow)) {
-      Object.assign(tooltipStore, {
-        row,
-        column,
-        visible: true,
-        currOpts: {}
-      })
-      this.$nextTick(() => {
-        const $tooltip = $refs.tooltip
-        if ($tooltip) {
-          $tooltip.open(isCellOverflow ? overflowElem : (tipElem || overflowElem), formatText(content))
-        }
-      })
-    }
-    return this.$nextTick()
-  },
   openTooltip (target: any, content: any) {
     const { $refs } = this
     const commTip = $refs.refCommTooltip
@@ -4895,7 +5442,7 @@ const Methods = {
         vLen++
       })
 
-    const isSelected = rootList.length > 0 && sLen >= vLen
+    const isSelected = vLen > 0 ? sLen >= vLen : sLen >= rootList.length
     const halfSelect = !isSelected && (sLen >= 1 || hLen >= 1)
 
     reactData.isAllSelected = isSelected
@@ -5771,10 +6318,10 @@ const Methods = {
 
           reactData.isDragRowMove = true
           $xeTable.handleTableData(treeConfig && transform)
-          $xeTable.cacheRowMap()
+          $xeTable.cacheRowMap(false)
           updateScrollYStatus($xeTable)
           if (!(treeConfig && transform)) {
-            $xeTable.updateAfterDataIndex()
+            updateAfterDataIndex($xeTable)
           }
           $xeTable.checkSelectionStatus()
           if (reactData.scrollYLoad) {
@@ -5816,18 +6363,16 @@ const Methods = {
     const hasChildField = treeOpts.hasChild || treeOpts.hasChildField
     const { prevDragRow, prevDragPos } = internalData
 
-    if (treeConfig && prevDragToChild) {
+    if (treeConfig && lazy && prevDragToChild) {
       // 懒加载
-      if (lazy) {
-        const newRowid = getRowid($xeTable, prevDragRow)
-        const rowRest = fullAllDataRowIdData[newRowid]
-        if (prevDragRow[hasChildField]) {
-          if (rowRest && rowRest.treeLoaded) {
-            $xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild)
-          }
-        } else {
+      const newRowid = getRowid($xeTable, prevDragRow)
+      const rowRest = fullAllDataRowIdData[newRowid]
+      if (prevDragRow[hasChildField]) {
+        if (rowRest && rowRest.treeLoaded) {
           $xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild)
         }
+      } else {
+        $xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild)
       }
     } else {
       $xeTable.handleRowDragSwapEvent(evnt, true, dragRow, prevDragRow, prevDragPos, prevDragToChild)
@@ -6929,7 +7474,7 @@ const Methods = {
               return this.$nextTick().then(() => {
                 if (transform) {
                   this.handleTableData()
-                  this.updateAfterDataIndex()
+                  updateAfterDataIndex($xeTable)
                   return this.$nextTick()
                 }
               })
@@ -7043,7 +7588,7 @@ const Methods = {
     return this.handleBaseTreeExpand(rows, expanded).then(() => {
       handleVirtualTreeToList($xeTable)
       this.handleTableData()
-      this.updateAfterDataIndex()
+      updateAfterDataIndex($xeTable)
     }).then(() => {
       return this.recalculate()
     }).then(() => {
@@ -7129,13 +7674,18 @@ const Methods = {
    * 获取表格的滚动状态
    */
   getScroll () {
-    const { $refs, scrollXLoad, scrollYLoad } = this
-    const bodyElem = $refs.refTableBody.$el
+    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const reactData = $xeTable as unknown as TableReactData
+    const internalData = $xeTable as unknown as TableInternalData
+
+    const { scrollXLoad, scrollYLoad } = reactData
+    const { elemStore } = internalData
+    const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
     return {
       virtualX: scrollXLoad,
       virtualY: scrollYLoad,
-      scrollTop: bodyElem.scrollTop,
-      scrollLeft: bodyElem.scrollLeft
+      scrollTop: bodyScrollElem ? bodyScrollElem.scrollTop : 0,
+      scrollLeft: bodyScrollElem ? bodyScrollElem.scrollLeft : 0
     }
   },
   handleScrollEvent (evnt: Event, isRollY: boolean, isRollX: boolean, scrollTop: number, scrollLeft: number, params: any) {
@@ -7240,48 +7790,6 @@ const Methods = {
     }
     $xeTable.dispatchEvent('scroll', evntParams, evnt)
   },
-  lazyScrollXData () {
-    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
-    const internalData = $xeTable as unknown as TableInternalData
-
-    const { lxTimeout, lxRunTime, scrollXStore } = internalData
-    const { visibleSize } = scrollXStore
-    const fpsTime = Math.max(5, Math.min(80, Math.floor(visibleSize * 3)))
-    if (lxTimeout) {
-      clearTimeout(lxTimeout)
-    }
-    if (!lxRunTime || lxRunTime + fpsTime < Date.now()) {
-      internalData.lxRunTime = Date.now()
-      loadScrollXData($xeTable)
-    }
-    internalData.lxTimeout = setTimeout(() => {
-      internalData.lxTimeout = undefined
-      internalData.lxRunTime = undefined
-      loadScrollXData($xeTable)
-    }, fpsTime)
-  },
-  lazyScrollYData () {
-    const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
-    const props = $xeTable
-    const internalData = $xeTable as unknown as TableInternalData
-
-    const { showOverflow } = props
-    const { lyTimeout, lyRunTime, scrollYStore } = internalData
-    const { visibleSize } = scrollYStore
-    const fpsTime = showOverflow ? 5 : Math.max(5, Math.min(80, Math.floor(visibleSize / 2)))
-    if (lyTimeout) {
-      clearTimeout(lyTimeout)
-    }
-    if (!lyRunTime || lyRunTime + fpsTime < Date.now()) {
-      internalData.lyRunTime = Date.now()
-      loadScrollYData($xeTable)
-    }
-    internalData.lyTimeout = setTimeout(() => {
-      internalData.lyTimeout = undefined
-      internalData.lyRunTime = undefined
-      loadScrollYData($xeTable)
-    }, fpsTime)
-  },
   /**
    * 横向 X 可视渲染事件处理
    */
@@ -7292,7 +7800,7 @@ const Methods = {
     if (sXOpts.immediate) {
       loadScrollXData($xeTable)
     } else {
-      $xeTable.lazyScrollXData()
+      lazyScrollXData($xeTable)
     }
   },
   /**
@@ -7305,14 +7813,14 @@ const Methods = {
     if (sYOpts.immediate) {
       loadScrollYData($xeTable)
     } else {
-      $xeTable.lazyScrollYData()
+      lazyScrollYData($xeTable)
     }
   },
   triggerBodyScrollEvent (evnt: Event, fixedType: '' | 'left' | 'right') {
     const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
     const internalData = $xeTable as unknown as TableInternalData
 
-    const { elemStore, lastScrollTop, lastScrollLeft, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll, scrollRenderType, inFooterScroll } = internalData
+    const { elemStore, intoRunScroll, lastScrollTop, lastScrollLeft, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll, scrollRenderType, inFooterScroll } = internalData
     const xHandleEl = $xeTable.$refs.refScrollXHandleElem as HTMLDivElement
     const yHandleEl = $xeTable.$refs.refScrollYHandleElem as HTMLDivElement
     const leftScrollElem = getRefElem(elemStore['left-body-scroll'])
@@ -7323,6 +7831,9 @@ const Methods = {
     if (inWheelScroll || inVirtualScroll || inHeaderScroll || inFooterScroll) {
       return
     }
+    if (intoRunScroll) {
+      return
+    }
     if (!bodyScrollElem) {
       return
     }
@@ -7380,22 +7891,16 @@ const Methods = {
     const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
     const internalData = $xeTable as unknown as TableInternalData
 
-    const { elemStore, inWheelScroll, inVirtualScroll, inBodyScroll, inFooterScroll } = internalData
+    const { elemStore, intoRunScroll, inWheelScroll, inVirtualScroll, inBodyScroll, inFooterScroll } = internalData
     const xHandleEl = $xeTable.$refs.refScrollXHandleElem as HTMLDivElement
     const yHandleEl = $xeTable.$refs.refScrollYHandleElem as HTMLDivElement
     const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
     const headerScrollElem = getRefElem(elemStore['main-header-scroll'])
     const footerScrollElem = getRefElem(elemStore['main-footer-scroll'])
-    if (inWheelScroll) {
-      return
-    }
-    if (inVirtualScroll) {
-      return
-    }
-    if (inBodyScroll) {
+    if (inWheelScroll || inVirtualScroll || inBodyScroll || inFooterScroll) {
       return
     }
-    if (inFooterScroll) {
+    if (intoRunScroll) {
       return
     }
     if (!headerScrollElem) {
@@ -7425,22 +7930,16 @@ const Methods = {
     const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
     const internalData = $xeTable as unknown as TableInternalData
 
-    const { elemStore, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll } = internalData
+    const { elemStore, intoRunScroll, inWheelScroll, inVirtualScroll, inHeaderScroll, inBodyScroll } = internalData
     const xHandleEl = $xeTable.$refs.refScrollXHandleElem as HTMLDivElement
     const yHandleEl = $xeTable.$refs.refScrollYHandleElem as HTMLDivElement
     const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
     const headerScrollElem = getRefElem(elemStore['main-header-scroll'])
     const footerScrollElem = getRefElem(elemStore['main-footer-scroll'])
-    if (inWheelScroll) {
+    if (inWheelScroll || inVirtualScroll || inHeaderScroll || inBodyScroll) {
       return
     }
-    if (inVirtualScroll) {
-      return
-    }
-    if (inHeaderScroll) {
-      return
-    }
-    if (inBodyScroll) {
+    if (intoRunScroll) {
       return
     }
     if (!footerScrollElem) {
@@ -7492,29 +7991,14 @@ const Methods = {
       return
     }
 
-    let multiple = 1
-
-    if (reactData.lastScrollTime + 25 > Date.now()) {
-      multiple = 1.18
-    } else if (reactData.lastScrollTime + 30 > Date.now()) {
-      multiple = 1.15
-    } else if (reactData.lastScrollTime + 40 > Date.now()) {
-      multiple = 1.12
-    } else if (reactData.lastScrollTime + 55 > Date.now()) {
-      multiple = 1.09
-    } else if (reactData.lastScrollTime + 75 > Date.now()) {
-      multiple = 1.06
-    } else if (reactData.lastScrollTime + 100 > Date.now()) {
-      multiple = 1.03
-    }
-
-    const deltaTop = deltaY * multiple
-    const deltaLeft = deltaX * multiple
+    const wheelSpeed = getWheelSpeed(reactData.lastScrollTime)
+    const deltaTop = deltaY * wheelSpeed
+    const deltaLeft = deltaX * wheelSpeed
 
     const isTopWheel = deltaTop < 0
-    const currScrollTop = yHandleEl.scrollTop
+    const currScrollTop = bodyScrollElem.scrollTop
     // 如果滚动位置已经是顶部或底部，则不需要触发
-    if (isTopWheel ? currScrollTop <= 0 : currScrollTop >= yHandleEl.scrollHeight - yHandleEl.clientHeight) {
+    if (isTopWheel ? currScrollTop <= 0 : currScrollTop >= bodyScrollElem.scrollHeight - bodyScrollElem.clientHeight) {
       return
     }
 
@@ -7530,19 +8014,34 @@ const Methods = {
         $xeTable.clearHoverRow()
       }
 
-      internalData.inWheelScroll = true
-      setScrollTop(yHandleEl, scrollTop)
-      setScrollTop(bodyScrollElem, scrollTop)
-      setScrollTop(leftScrollElem, scrollTop)
-      setScrollTop(rightScrollElem, scrollTop)
-      $xeTable.triggerScrollYEvent(evnt)
-      $xeTable.handleScrollEvent(evnt, isRollY, isRollX, scrollTop, scrollLeft, {
-        type: 'footer',
-        fixed: ''
+      wheelScrollTo(scrollTop - bodyScrollElem.scrollTop, (offsetTop: number) => {
+        const currTopNum = bodyScrollElem.scrollTop + offsetTop
+        internalData.inWheelScroll = true
+        setScrollTop(yHandleEl, currTopNum)
+        setScrollTop(bodyScrollElem, currTopNum)
+        setScrollTop(leftScrollElem, currTopNum)
+        setScrollTop(rightScrollElem, currTopNum)
+        $xeTable.triggerScrollYEvent(evnt)
+        $xeTable.handleScrollEvent(evnt, isRollY, isRollX, currTopNum, scrollLeft, {
+          type: 'table',
+          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: ''
+      // })
     }
   },
-  scrollXEvent (evnt: Event) {
+  triggerVirtualScrollXEvent (evnt: Event) {
     const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
     const internalData = $xeTable as unknown as TableInternalData
 
@@ -7577,7 +8076,7 @@ const Methods = {
       fixed: ''
     })
   },
-  scrollYEvent (evnt: Event) {
+  triggerVirtualScrollYEvent (evnt: Event) {
     const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
     const internalData = $xeTable as unknown as TableInternalData
 
@@ -7618,9 +8117,7 @@ const Methods = {
 
     const { showOverflow } = props
     handleTableColumn($xeTable)
-    // calcCellHeight()
     return $xeTable.$nextTick().then(() => {
-      // calcCellHeight()
       handleTableColumn($xeTable)
       $xeTable.updateScrollXSpace()
       if (!showOverflow) {
@@ -7681,9 +8178,7 @@ const Methods = {
     const $xeTable = this
 
     $xeTable.handleTableData()
-    // calcCellHeight()
     return $xeTable.$nextTick().then(() => {
-      // calcCellHeight()
       $xeTable.handleTableData()
       $xeTable.updateScrollYSpace()
     })
@@ -7696,33 +8191,34 @@ const Methods = {
     const internalData = $xeTable as unknown as TableInternalData
 
     const { showOverflow } = props
-    const { scrollYLoad, rowHeight } = reactData
-    const { scrollYStore, elemStore, afterFullData, fullAllDataRowIdData } = internalData
+    const { scrollYLoad } = reactData
+    const { scrollYStore, elemStore, isResizeCellHeight, afterFullData, fullAllDataRowIdData } = internalData
     const { startIndex } = scrollYStore
+    const rowOpts = $xeTable.computeRowOpts
+    const cellOpts = $xeTable.computeCellOpts
+    const defaultRowHeight = $xeTable.computeDefaultRowHeight
     const bodyTableElem = getRefElem(elemStore['main-body-table'])
     const containerList = ['main', 'left', 'right']
     let topSpaceHeight = 0
     let ySpaceHeight = 0
+
     if (scrollYLoad) {
-      if (showOverflow) {
-        ySpaceHeight = afterFullData.length * rowHeight
-        topSpaceHeight = Math.max(0, startIndex * rowHeight)
+      const isCustomCellHeight = isResizeCellHeight || cellOpts.height || rowOpts.height
+      if (!isCustomCellHeight && showOverflow) {
+        ySpaceHeight = afterFullData.length * defaultRowHeight
+        topSpaceHeight = Math.max(0, startIndex * defaultRowHeight)
       } else {
         for (let i = 0; i < afterFullData.length; i++) {
           const row = afterFullData[i]
           const rowid = getRowid($xeTable, row)
           const rowRest = fullAllDataRowIdData[rowid]
-          if (rowRest) {
-            ySpaceHeight += rowRest.height || rowHeight
-          }
+          ySpaceHeight += rowRest ? (rowRest.resizeHeight || cellOpts.height || rowOpts.height || defaultRowHeight) : defaultRowHeight
         }
         for (let i = 0; i < startIndex; i++) {
           const row = afterFullData[i]
           const rowid = getRowid($xeTable, row)
           const rowRest = fullAllDataRowIdData[rowid]
-          if (rowRest) {
-            topSpaceHeight += rowRest.height || rowHeight
-          }
+          topSpaceHeight += rowRest ? (rowRest.resizeHeight || cellOpts.height || rowOpts.height || defaultRowHeight) : defaultRowHeight
         }
       }
     } else {
@@ -7747,7 +8243,7 @@ const Methods = {
     if (scrollYSpaceEl) {
       scrollYSpaceEl.style.height = ySpaceHeight ? `${ySpaceHeight}px` : ''
     }
-    $xeTable.$nextTick(() => {
+    return $xeTable.$nextTick().then(() => {
       updateStyle($xeTable)
     })
   },