拖动 div 时的 onMouseOver 事件答案

【问题标题】：onMouseOver event when dragging a div拖动 div 时的 onMouseOver 事件
【发布时间】：2017-12-28 17:04:08
【问题描述】：

我正在使用 react-draggable 将 div 拖到桌子上的另一个位置。问题是我需要让底层<td> 触发onMouseOver 事件，同时我将div 拖到它们上方。但由于我的鼠标位于可拖动的 div 上，因此鼠标事件不会在底层 <td> 上触发。

我尝试使用pointer-events: none;，但这会导致可拖动对象不可拖动。

<td className={cls} onClick={this.handleCancelOpenOrders} onMouseOver={this.handleMouseOver}>
    <Draggable axis="y" position={{ x: 0, y: 0 }} onDrag={this.handleDrag} onStart={this.handleDragStart} onStop={this.handleDragStop}>
        <div className={styles[this.props.type]}>
            <span className={styles.currentOrderText}>
                  {orderQuantity}
            </span>
        </div>
    </Draggable>
</td>

【问题讨论】：

你能发布一些你的代码来帮助我们吗？
@MatheusCuba 使用代码 sn-p 更新。

标签： javascript css html reactjs draggable

【解决方案1】：

我可以通过创建一个可观察的 isDraggable 来解决这个问题，并且当它为 true 时设置指针事件：无；在被拖动的 div 上。

【讨论】：