fix: Fixed the issue in DragMove that after setting the handler, Drag…

…Move child elements can still be dragged (#2662)
DouyinFE · Jan 7, 2025 · d9e931c · d9e931c
1 parent 3dbb4c0
commit d9e931c
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 14 deletions.
diff --git a/packages/semi-foundation/dragMove/foundation.ts b/packages/semi-foundation/dragMove/foundation.ts
@@ -46,9 +46,21 @@ export default class DragMoveFoundation<P = Record<string, any>, S = Record<stri
         this.element = element;
         this.element.style.position = 'absolute';
         this.handler.style.cursor = 'move';
+        this._registerStartEvent();
+    }
+
+    _registerStartEvent = () => {
+        this.handler.addEventListener('mousedown', this.onMouseDown);
+        this.handler.addEventListener('touchstart', this.onTouchStart);
+    }
+
+    _unRegisterStartEvent = () => {
+        this.handler.removeEventListener('mousedown', this.onMouseDown);
+        this.handler.removeEventListener('touchstart', this.onTouchStart);
     }
 
     destroy() {
+        this._unRegisterStartEvent();
         this._unRegisterEvent();
     }
 

diff --git a/packages/semi-ui/dragMove/index.ts b/packages/semi-ui/dragMove/index.ts
@@ -130,20 +130,6 @@ export default class DragMove extends BaseComponent<DragMoveProps, null> {
                     ref.current = node;
                 }
             },
-            onMouseDown: (e: MouseEvent) => {
-                this.foundation.onMouseDown(e);
-                const { onMouseDown } = children.props;
-                if (typeof onMouseDown === 'function') {
-                    onMouseDown(e);
-                }
-            },
-            onTouchStart: (e: TouchEvent) => {
-                this.foundation.onTouchStart(e);
-                const { onMouseMove } = children.props;
-                if (typeof onMouseMove === 'function') {
-                    onMouseMove(e);
-                }
-            },
         });
         return newChildren;
     }