在 React 中更改不允许的拖动光标答案

【问题标题】：Change not-allowed cursor on drag in React在 React 中更改不允许的拖动光标
【发布时间】：2021-05-19 20:55:01
【问题描述】：

当我将 draggable 设置为 true 的图像在 react 中拖动时，我得到 not-allowed / no-drop 光标。我不知道如何用 CSS 来覆盖它。我处理阻力的方式是onDragStart，然后是onDragEnd。

【问题讨论】：

【解决方案1】：

如果没有一些可重现的代码，我只能在黑暗中尝试一下：您必须在拖动处理程序的开头调用e.preventDefault();。

【讨论】：

【解决方案2】：

我在处理我的一个 React 项目时遇到了同样的问题，所以我做了一些研究并测试了我发现的几种方法，但对我没有任何效果。您会看到有一个名为 DataTransfer.effectAllowed 的属性指定了允许进行拖动操作的效果，并且您可以在此处阅读此 API 的限制 -

更改样式或附加 eventListener 将不起作用，您必须为此使用不同的后端。使用 react-dnd 和 react-dnd-touch-backend 或 react-dnd-html5-backend npm 包作为自定义后端。

【讨论】：