使用react-dnd拖放到形状的边缘？

Question

我需要的想法来开发拖放一个箭头的几何形状的边缘喜欢的矩形，圆等在一个反应项目，使用反应-dnd为显示北向。另一方面，我应该保存箭头的位置，以便在同一位置再次显示它。有什么想法吗？

​

​

Answer 1

是的，您必须将坐标保存在您所在州的某个位置。然后使用useDrop钩子(doc)在箭头放置到新位置时将箭头的新坐标推到您所在的状态。

总而言之，这个过程如下：

• 初始化您希望箭头到达的状态中的坐标
• 使用useDrag
  • pass to useDrag a begin -that修改您的状态-只要开始拖动箭头就会调用<代码>H211<代码>H112对<代码>D13执行同样的操作<代码>D13它将是动画，您将能够拖动它，它将紧随其后，您甚至可以根据您在<代码>D16和<代码>D17 functions

中设置的状态项更改其外观

​

使用useDrop使您的箭头组件成为可删除的

- as for `useDrag`, pass a `drop` function to push to state the new coordinates of the arrow.

​

因为你没有提供任何代码，所以很难给你更多的帮助。如果这样做的原因是你不知道从哪里开始，请看看这个神奇的step-by-step tutorial。

但是，请记住，所有这些都会触发大量的重新渲染。就我个人而言，对于这类东西，我喜欢避免使用第三方库，以保持性能在控制之下，并倾向于尽可能接近dom (例如，使用js事件，而不是在拖动时不断更新状态)。