Javascript dnd：当存在多个列表时，拖动一行中的内容将从所有行中拖动相同的索引

我有一个简单的dnd应用程序，其中我有多行，您可以在它们自己的行中拖动组件

我的问题是，当我在一行内拖动一个可拖动对象时，内容移动和拖动组件消失的视觉效果会发生在每一行上

下面是一个gif演示我的问题：

下面是一个代码沙盒，其中包含问题的交互式演示，并逐步重现问题：

---

我认为您的问题是由重用可拖动ID引起的。您的ID当前基于正方形的索引。这些将在不同的行中重复。尝试移动到每个方块的唯一id

---

有关更多详细信息，请参见此处：

非常感谢，这确实是个问题。你的链接非常有用。我通过将draggableId设置为与数据关联的唯一id来修复它。但是，第二个问题是，由于id来源于数据，因此如果存在多个相同的可拖动数据，则会失败，因为id不再是唯一的。我不确定我怎么会有不使用索引的、具有唯一ID的重复数据，但我认为这个问题本身值得一提。再次感谢：）