fix(core): 在没有拖拽的情况下，Control组件突然销毁，不触发cancelDrag(#1926)

didi · Oct 29, 2024 · 9f34449 · 9f34449
1 parent 9b5f3f5
commit 9f34449
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git a/packages/core/src/util/drag.ts b/packages/core/src/util/drag.ts
@@ -201,4 +201,16 @@ export class StepDrag {
     this.onDragEnd({ event: undefined })
     this.isDragging = false
   }
+
+  componentWillUnmount = () => {
+    if (this.isStartDragging) {
+      // https://github.com/didi/LogicFlow/issues/1934
+      // https://github.com/didi/LogicFlow/issues/1926
+      // cancelDrag()->onDragEnd()->updateEdgePointByAnchors()触发线的重新计算
+      // 我们的本意是为了防止mousemove和mouseup没有及时被移除
+      // 因此这里增加if(this.isStartDragging)的判断，isStartDragging=true代表没有触发handleMouseUp()，此时监听还没被移除
+      // 在拖拽情况下(isStartDragging=true)，此时注册了监听，在组件突然销毁时，强制触发cancelDrag进行监听事件的移除
+      this.cancelDrag()
+    }
+  }
 }
diff --git a/packages/core/src/view/Control.tsx b/packages/core/src/view/Control.tsx
@@ -57,7 +57,7 @@ export class ResizeControl extends Component<
   }
 
   componentWillUnmount() {
-    this.dragHandler.cancelDrag()
+    this.dragHandler.componentWillUnmount()
   }
 
   updateEdgePointByAnchors = () => {