From 7e41d7a5868851cb693e436dd08f328a16295a97 Mon Sep 17 00:00:00 2001
From: Heising <65594411+Heising@users.noreply.github.com>
Date: Wed, 31 Jul 2024 23:30:57 +0800
Subject: [PATCH] fix(TagInput): onDragSort capture context error caused by
 useRef (#3003)

* fix(TagInput): onDragSort capture context error caused by useRef

* fix(usedragsorter): usage useEventCallback

---------

Co-authored-by: HaixingOoO <974758671@qq.com>
---
 src/hooks/useDragSorter.tsx | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/hooks/useDragSorter.tsx b/src/hooks/useDragSorter.tsx
index 4a3103dc0b..4f51fe8991 100644
--- a/src/hooks/useDragSorter.tsx
+++ b/src/hooks/useDragSorter.tsx
@@ -1,4 +1,5 @@
-import { useCallback, useRef, useState } from 'react';
+import { useCallback, useState } from 'react';
+import useEventCallback from './useEventCallback';
 
 interface DragSortProps<T> {
   sortOnDraggable: boolean;
@@ -36,8 +37,8 @@ function useDragSorter<T>(props: DragSortProps<T>): DragSortInnerProps {
   const [dragStartData, setDragStartData] = useState(null);
   const [isDropped, setIsDropped] = useState(null);
   const [startInfo, setStartInfo] = useState({ nodeX: 0, nodeWidth: 0, mouseX: 0 });
+  const onDragSortEvent = useEventCallback(onDragSort);
 
-  const onDragSortRef = useRef(onDragSort);
   const onDragOver = useCallback(
     (e, index, record: T) => {
       e.preventDefault();
@@ -64,7 +65,7 @@ function useDragSorter<T>(props: DragSortProps<T>): DragSortInnerProps {
         if (!overlap) return;
       }
 
-      onDragSortRef.current?.({
+      onDragSortEvent({
         currentIndex: draggingIndex,
         current: dragStartData,
         target: record,
@@ -80,6 +81,7 @@ function useDragSorter<T>(props: DragSortProps<T>): DragSortInnerProps {
       startInfo.nodeWidth,
       startInfo.mouseX,
       startInfo.nodeX,
+      onDragSortEvent,
     ],
   );