diff --git a/src/Cell/useCellResize.tsx b/src/Cell/useCellResize.tsx index aaaf54ca4..b7d71b639 100644 --- a/src/Cell/useCellResize.tsx +++ b/src/Cell/useCellResize.tsx @@ -28,11 +28,6 @@ export default function useCelResize( 'onColumnResizeComplete', 'onResizingChange', ]); - const colsWidthsRef = useRef(colsWidths); - colsWidthsRef.current = colsWidths; - const colWidthsRef = useRef(colWidths); - colWidthsRef.current = colWidths; - const [isResizing, setIsResizing] = useState(false); const [lineLeft, setLineLeft] = useState(0); const lineStartLeftRef = useRef(0); @@ -50,7 +45,7 @@ export default function useCelResize( const onResize = (event: MouseEvent, isResizeEnd?: boolean) => { const offset = event.pageX - startPageX.current; - const oldWidth = colsWidthsRef.current.get(columnKey); + const oldWidth = colsWidths.get(columnKey); let newWidth = startRealWidth.current + (isFixRight ? -offset : offset); const minWidth = typeof resizable === 'object' ? resizable.minWidth || 0 : 0; @@ -63,7 +58,7 @@ export default function useCelResize( ); if (isResizeEnd) { - const totalWidth = colWidthsRef.current.reduce((total, width) => total + width, 0); + const totalWidth = colWidths.reduce((total, width) => total + width, 0); const smallThanWidth = componentWidth - (totalWidth - oldWidth + newWidth); // If it is less than the width of the table, the remaining width will be allocated to the column on the right. // If there is no column on the right, it will be allocated to the column on the left. @@ -74,11 +69,10 @@ export default function useCelResize( addWidthColumnKey = colsKeys[index + 1] ?? colsKeys[index - 1]; } - const columnKeyWidthsMap = new Map(colsWidthsRef.current); + const columnKeyWidthsMap = new Map(colsWidths); columnKeyWidthsMap.set(columnKey, newWidth); if (addWidthColumnKey) { - const addWidthColumnNewWidth = - colsWidthsRef.current.get(addWidthColumnKey) + (oldWidth - newWidth); + const addWidthColumnNewWidth = colsWidths.get(addWidthColumnKey) + (oldWidth - newWidth); columnKeyWidthsMap.set(addWidthColumnKey, addWidthColumnNewWidth); } const columnKeyWidths = Array.from(columnKeyWidthsMap).map(([key, width]) => ({ @@ -105,7 +99,7 @@ export default function useCelResize( ] - fullTableRef.current.getBoundingClientRect().left; setLineLeft(left); lineStartLeftRef.current = left; - startRealWidth.current = colsWidthsRef.current.get(columnKey); + startRealWidth.current = colsWidths.get(columnKey); startPageX.current = event.pageX; document.body.addEventListener('mousemove', onResize); document.body.addEventListener('mouseup', onResizeEnd);