我正在使用react-draggable将div拖到桌子上的另一个位置。问题是我需要让基础<td>触发onMouseOver事件，同时我将div拖到它们上面。但由于我的鼠标位于可拖动的div上，因此鼠标事件不会触发基础<td>。
handleStart = (event, data, name) => {
console.log(event, data, name)
var names = document.getElementsByClassName("group")
for (var i = 0; i < names.length; i++) {
names[i].style.pointerEvents = "none";
}
}
handleStop = (e, data) => {
// console.log(e, data)
var names = document.getElementsByClassName("group")
for (var i = 0; i < names.length; i++) {
names[i].style.pointerEvents = "auto";
}
}
<div className="transport" onMouseOver={() => this.mouseEnter("1")}>
<div className="groupCon" >
<Draggable
onStart={(event, data) => this.handleStart(event, data, "拖动对象")}
onStop={this.handleStop}
position={{ x: 0, y: 0 }}
>
<div className="group" style={{ left: '0%' }} >
<img src={Level1} alt="" className='level' draggable="false" />
<Popover placement="bottom" content={this.content} trigger="contextMenu">
<img src={Car} alt="" draggable="false" />
</Popover>
<p>1号车</p>
<span>路程进度0%</span>
</div>
</Draggable>
</div>
</div>
我能够通过创建一个可观察的事件来修复这个问题，当它为真时，在被拖动的isDraggable上设置pointerEvents=none；
