我们都使用react-sortable-hoc和react-dropzone，并且如果它们在单独的页面上也可以正常工作。但是，在同一页面上使用react-sortable-hoc时react-dropzone无法正常工作，因为我注意到react-dropzone也被react-sortable-hoc的拖动事件触发了。 （例如，我不能再在其他项目之间拖动项目。）
我尝试在e.preventDefault()的{{1}}事件上添加e.stopPropagation()和react-sortable-hoc，但是onSortStart仍在触发。
还有什么其他方法可以使他们在一起玩得开心/不让其他人受到影响？
答案 0 :(得分：4)
如果问题是在 droping 时引起的（不是在开始拖动时引起的）：react-dropzone接管了有关文件丢弃的整个窗口，以防止浏览器导航如果用户错过了放置区域（常见的烦恼），则从当前页面移至放置的文件。
更具体地说，dragover和drop处理函数是registered on the document：
document.addEventListener('dragover', onDocumentDragOver, false)
document.addEventListener('drop', onDocumentDrop, false)
如果这是问题所在，您应该可以通过将react-dropzone option preventDropOnDocument设置为false（默认为true）来规避此问题。
或者，您可以尝试react-dropzone option noDragEventsBubbling，但我认为这可以解决相反的问题（在删除文件时触发react-sortable-hoc上的事件）
答案 1 :(得分：2)
我创建了一个沙箱，并尝试在同一组件上同时使用react-dropzone和react-sortable-hoc来重现您的代码。而且效果很好，没有问题。
https://codesandbox.io/s/nifty-ganguly-khswc?file=/src/App.js:1156-1485