react-draggable 拖动div时的onMouseOv

我正在使用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；