滚动到对话框末尾后无法拖动项目-react-dnd

Question

当我从对话框中拖放时， react-dnd 库出现问题

当我拖动项目而不滚动到对话框的末尾时，一切正常，

但是当我滚动到对话框的末尾时，该项目不能被拖动

另一个奇怪的是，该问题在Firefox浏览器中不存在，仅在chrome中不存在

注意： 我确实将console.log放在 beginDrag 和 endDrag 中，我发现endDrag是在开始

之后直接调用的

ScreenShot

https://drive.google.com/file/d/1YX2Uxn66luARilVfJXucJgjBzhoaMAkU/view?usp=sharing

Answer 1

我找到了解决方法：

在拖动开始后，有时无法对自定义拖动层进行dom操作（在chrome中）

像这样一个：

<div ref={this.badItemRef} className="badItem" style={{
                opacity: isDragging ? "0" : "1",
                 height: isDragging ? 0 : '',
            }}>
</div>

我通过操作 beginDrag 函数中的项目的CSS并通过setTimeOut函数

包装了该操作，从而解决了该问题

像这样：

// hide after a timeout
        setTimeout(() => {
            currentItemRef.style.display = "none";
        }, 0)

现在一切都看起来不错！