我正在尝试使用苗条框架为svg中的形状构建拖放功能。这是 svg 的结构
<svg>
<g
on:mousedown={mouseDownHandler}
on:mousemove={mouseMoveHandler}
on:mouseup={mouseUpHandler}>
<circle />
</g>
但是使用这种结构，如果我快速移动鼠标，它可能会在可以使用当前鼠标位置更新之前意外移出<g>，并且 mouseMoveHandler 将停止响应。
我尝试了诸如记住mouseDownHandler中的选定元素之类的方法，希望即使鼠标不再在组中，它仍然可以使用当前的鼠标位置进行移动。但它并没有像我预期的那样工作。
我怀疑此鼠标移动处理程序仅在鼠标在组内时激活，正确吗？关于如何克服这个问题的任何建议？
谢谢
更新： 我知道将处理程序添加到父组可以解决问题。我之所以希望这样做，是因为有不同类型的元素，我想用它们做不同的事情。现在，我在svg下将所有内容都放在一个大的mouseMoveHandler中，并且一切正常，但是当我向处理程序添加更多功能时，它变得非常丑陋。这就是为什么我希望为不同的元素使用不同的处理程序。
当你实现拖放时(在任何情况下，不仅仅是 Svelte 或 SVG(，永远不要将"move"处理程序应用于元素本身。始终将其(和"向上"处理程序(应用于window。"向下"处理程序应负责记录开始坐标并注册"移动"/"向上"处理程序，仅此而已。