How to avoid native onDrop event from being overwritten for react-dnd?

问题

I'm successfully using react-dnd in a react component for a requirement of the application I'm working on.

Said component also has a button that show a simple modal window:

<Modal show={this.props.show} onHide={this.props.onHide} id={'image-modal'} {...this.props}  animation={true}>
      ...
      <Modal.Body>
          <div id="drop-target" onDragOver={this.handleDrag} onDrop={this.handleDrop}>
            <div className="text-center"><p>Put your image here</p></div>
          </div>
      </Modal.Body>
      ...
    </Modal> 

As you can see, this modal contains a div element that is listening for native html drag and drop events. My problem is that apparently these native events are somehow being overwritten for react-dnd, rendering them useless.

I tested by eliminating all reeact-dnd drop target from the component and as I expected, the native events are now working. How can I achieve the behavior I'm expecting?

来源：https://stackoverflow.com/questions/33747346/how-to-avoid-native-ondrop-event-from-being-overwritten-for-react-dnd