在React DND中,当鼠标位于放置目标上方时,hover
会触发。当拖动图像的中心位于放置目标上方时,我需要触发一个事件:
+---------+
|m |
| c |-----+
| | |
+---------+ |
| |
+---------+
如果m
是鼠标的位置,则hover
不会触发,直到两个元素几乎重叠。为了使c
(中心)在元素上方时触发事件,我在考虑两个想法:
在整个应用上触发hover
时,请根据getSourceClientOffset
加上元素尺寸的一半来计算中心坐标,然后使用elementFromPoint
查找DOM节点并从在那里。
将放下的目标中的每个元素包装到足以触发hover
的位置上,即使鼠标位于拖动图像的尖端。然后找到拖动图像的中心,看看它是否在实际元素的边界矩形上,因为现在目标将重叠。
两个想法都开始让我觉得我可能不在React DND的设计范围之内。有没有更自然的方法可以与HTML5和触摸后端配合使用?