Browse Source

fix: Fixed the issue in DragMove that after setting the handler, DragMove child elements can still be dragged (#2662)

YyumeiZhang 9 months ago
parent
commit
d9e931c738
2 changed files with 12 additions and 14 deletions
  1. 12 0
      packages/semi-foundation/dragMove/foundation.ts
  2. 0 14
      packages/semi-ui/dragMove/index.ts

+ 12 - 0
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();
     }
 

+ 0 - 14
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;
     }