拖放库 dnd-kit 在我的 React 示例中不起作用答案

【问题标题】：drag and drop library dnd-kit not working in my React example拖放库 dnd-kit 在我的 React 示例中不起作用
【发布时间】：2021-04-08 02:35:13
【问题描述】：

我一直在尝试为 React 实现一个名为 dnd-kit 的拖放库。

在使用叠加层排序列表的指南的帮助下，我一直在研究一个非常基本的示例，但它不起作用，我不知道我做错了什么。

动画无法正常工作，如果我与第一行交互，它会冻结并完全停止工作。

有什么帮助吗？

编辑：在玩了一段时间和作者的一些输入之后，我让它工作得更好了，发现组件 DragOverlay 导致了我目前无法解决的问题。

如果 DragOverlay 被删除或移到 DndContext 之外，它的排序很好，但没有覆盖效果。

【问题讨论】：

Fish...我试过了，但似乎我也做不到...我得到了一个错误，当拖动到第一个元素时，也许在某个地方有线索。我想我明天会再看看这个，但这是我所做的~基本没什么~：codesandbox.io/s/…
感谢您的浏览。玩了一段时间（很长一段时间）后，我发现问题与 Overlay 组件有关。如果我省略它或将它设置在 DndContext 之外，它可以正常工作，但没有覆盖效果。
确实如此。第一项仍然不起作用：/。如果发生您自己解决的问题，请发布答案。我也必须实现一个拖放的东西，我正在（懒惰）研究它
哈哈哈确定。您可以在不使用组件“dragoverlay”的情况下检查沙箱，它虽然不完美，但运行良好

【解决方案1】：

问题是由 id 0 引起的。基本上，您传递给 useSortable 挂钩的 id 必须是字符串（或真值）

我将 ID 从数字更改为字符串，它开始工作。我还分叉并更新了你的Sandbox Code

【讨论】：