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

标签 reactjs drag-and-drop dnd-kit

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

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

Here is the Sandbox Code

动画无法正常工作,如果我与第一行交互,它就会卡住并完全停止工作。

请问有什么帮助吗?

经过一段时间的使用和作者的一些输入后,我让它工作得更好了一些,并发现组件 DragOverlay 导致了我目前无法解决的问题。

如果 DragOverlay 被删除或移到 DndContext 之外,它排序得很好,但没有叠加效果。

最佳答案

问题是由 id 0 引起的。基本上,传递给 useSortable Hook 的 id 必须是字符串(或 true)

我将 id 从数字更改为字符串,它开始工作。我还 fork 并更新了您的 Sandbox Code

关于reactjs - 拖放库 dnd-kit 在我的 React 示例中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66996614/

相关文章:

javascript - React 的 getDOMNode 总是返回组件的根 DOM 节点而不是引用的节点

javascript - React useState() bool 切换组件添加而不是替换值

javascript - Jquery 拖放验证

javascript - 是否可以限制一个 div 可以拥有的最大子级数量?

Java 多个拖放面板不起作用

javascript - 带有 React 组件加载图像的 SharePoint 框架

javascript - 如何将 Create-React-App 构建推送到 Heroku?