diff --git a/src/table/hooks/useColumnResize.ts b/src/table/hooks/useColumnResize.ts index 9e2925a71..f4d22ca99 100644 --- a/src/table/hooks/useColumnResize.ts +++ b/src/table/hooks/useColumnResize.ts @@ -56,9 +56,9 @@ export default function useColumnResize(tableContentRef: Ref, re const tableBoundRect = tableContentRef.value?.getBoundingClientRect(); const resizeLinePos = targetBoundRect.right - tableBoundRect.left; const colLeft = targetBoundRect.left - tableBoundRect.left; - const minColLen = col.resize?.minWidth || DEFAULT_MIN_WIDTH; + const minColWidth = col.resize?.minWidth || DEFAULT_MIN_WIDTH; const maxColWidth = col.resize?.maxWidth || DEFAULT_MAX_WIDTH; - const minResizeLineLeft = colLeft + minColLen; + const minResizeLineLeft = colLeft + minColWidth; const maxResizeLineLeft = colLeft + maxColWidth; // 开始拖拽,记录下鼠标起始位置 @@ -78,10 +78,15 @@ export default function useColumnResize(tableContentRef: Ref, re const onDragEnd = () => { if (resizeLineParams.isDragging) { // 结束拖拽,更新列宽 - const width = parseInt(resizeLineStyle.left, 10) - colLeft; - + let width = Math.ceil(parseInt(resizeLineStyle.left, 10) - colLeft) || 0; + // 为了避免精度问题,导致 width 宽度超出 [minColWidth, maxColWidth] 的范围,需要对比目标宽度和最小/最大宽度 + if (width <= minColWidth) { + width = minColWidth; + } else if (width >= maxColWidth) { + width = maxColWidth; + } // eslint-disable-next-line - col.width = `${Math.floor(width)}px`; + col.width = `${width}px`; // 恢复设置 resizeLineParams.isDragging = false;