我有相反的问题。 为了使HTML5后端可以与dropzone配合使用，我必须这样做：

beginDrag(props) {
  Dropzone.instances[0].disable() 

和

endDrag(props, monitor, component) {
  Dropzone.instances[0].enable()

我的Dropzone已安装到主体，您可能需要按照安装它的顺序进行操作。
我认为，如果没有其他方法，则使其遍及整个身体，然后根据将文件放到何处进行操作，可能是适合您的方法。

我还遇到了一个问题，其中可拖动项具有<input> ，如果用户在其中选择/拖动它，则会将其拖动。 如果输入集中，我可能可以从canDrag返回false ，这应该可以解决问题。

虽然不确定如何解决干扰HTML拖放上传的问题。 我已经在整个布局上启用了它。 @gaearon ，有什么想法吗？

@ffxsam这仍然是您的问题吗？

我不知道。 由于这个问题，我不得不将其卸载，所以我不能告诉你它是否仍然是一个问题-对不起！ 如果需要，可以关闭此问题。

嗨，我遇到了一个相同的问题，我打算打开一个问题，但我发现它已经打开了。
因此，问题是，无论您在哪里实例化ReactDnD，本地onDrop事件都将停止工作。
我有相同的用例，整个主体都是一个“ dropzone”，始终在侦听要拖放的文件，我只是对该组件使用本机事件，因为它的功能非常简单，并且是开箱即用的。 但是在我有ReactDnD的视图上，drop事件不会被触发，而且很有趣，因为它不会覆盖onDragEnter或onDragStart事件。
任何线索@kesne @gaearon吗？ 我真的不想卸载ReactDnD，到目前为止，这是对React最好的拖放依赖。

@kesne @gaearon我遇到与@xavibonell相同的问题。 我基本上是将React DND与Wordpress一起使用，而wordpress媒体上传器使用本机放置事件进行文件上传。 仅当在应用程序中使用ReactDND时，才会触发其onDrop回调。 删除Reactdnd放置目标可以解决该问题。 我已经在该项目上花费了几个月的时间，而reactdnd是该项目的核心部分，并且已被广泛使用。 在这个关头，我绝对不能搬到另一个图书馆。 从该线程以及Stack Overflow中的类似报告中，我看到这个问题已经存在了一段时间。 任何解决方案将不胜感激。

是的，本地dnd元素和自定义dnd元素之间可能存在不良的交互。 我目前没有足够的时间来研究这个问题，但是我打算为这个项目留出一些时间，这将是我研究的第一个问题。

如果可以的话，通过复制示例获得最小的回购设置将非常有用，这样我们就可以尝试找出处理此问题的最佳方法。

@kesne非常感谢您的回复，很高兴知道您会对此问题进行调查。 我一定会为您创建一个在线示例，并尽早在此处发布链接。
同时，我似乎发现了一个临时的hack，还没有对其进行彻底的测试，但是现在看来可以解决了。 我注意到HTML5Backend中有setup（）和teardown（）函数，它们将所有事件侦听器绑定到window元素。 在我的情况下，wordpress文件上传器是一个模态框，它占据了整个屏幕，因此当模态打开时，任何ReactDND元素都不能被拖放。 因此，在模式窗口的打开事件期间，我在后端实例（可通过DragDropManager获得）上调用teardown（）函数，而在模式窗口关闭期间，我调用setup（）函数。 这似乎工作正常，但是请您让我知道是否再次调用拆解和设置函数会导致现有或新渲染组件上的ReactDND出现任何其他问题？

这就是问题： https :

根据代码的注释“不要显示漂亮的光标”，似乎将e.dataTransfer.dropEffect视为仅一个显示属性。 但是，将dropEffect设置为none实际上似乎可以防止文件一起被删除。 值得注意的是，将其设置为move ， copy或link可以正常工作。 这是在Chrome 55.0.2中。

实际上，我们可以将其全部复制到react-dnd之外。 我创建了一个小提琴来解决问题： https :

有关dropEffect的effectAllowed可以起作用，而dropEffect应该是呈现性的。 小提琴不言而喻...

编辑：这是与https://github.com/gaearon/react-dnd-html5-backend/issues/25相同的问题

我可以确认我的情况，只需注释掉e.dataTransfer.dropEffect = 'none'; （在https://github.com/react-dnd/react-dnd-html5-backend/blob/85fc956c58a5d1a9fde2fca3c7fca9115a7c87df/src/HTML5Backend.js#L452 ）解决了我的react-dnd干扰我的Dropzone投递事件的问题。

作为参考，我有一个类似于以下内容的设置：

<DragDropContextProvider backend={HTML5Backend}>
  <Dropzone>
    <DropTargetComponent />
    <OtherComponent>
      <DragSourceComponent1 />
      <DragSourceComponent2 />
      <DragSourceComponentN />
    </OtherComponent>
  </Dropzone>
</DragDropContextProvider>

其中DropTargetComponent = DropTarget(TYPE, target, collect)(Component)和DragSourceComponent = DragSource(TYPE, source, collect)(Component) 。

此修补程序是否有任何已知的副作用或可用的更好的修补程序？ 否则，可以将其永久合并吗？

感谢您所做的所有出色工作，并感谢@ kn0ll找出解决方法。

[编辑]
我制作了一个Github fork和一个npm包，直到这个问题在主项目中得到解决为止（如果任何人都可以使用）。

感谢您的解决方法

我发现使用react-dropzone示例可以嵌套嵌套dropzone。 它停止传播，我认为这是问题所在。 这是我的解决方法，直到今天发现此问题

我遇到了同样的问题。 考虑到嵌套拖放区的概念，我最终将我的uploading-component包裹在div中，并在该div中添加了onDragOver属性，这只是停止了传播。 对于我来说，这似乎可以正常工作，这是示例（我正在使用Filepond）：

 handleDragOver (event) {
    console.log('dragged over ', event.dataTransfer)
    event.stopPropagation()
  }

  render () {
    return (
      <div onDragOver={this.handleDragOver}>
        <FilePond />
      </div>
    )
  }

但是，不喜欢react-dnd会对其他组件的d＆d功能造成很大影响的想法。 这似乎是一个巨大的不幸，在某些组件中，将react-dnd用于d＆d DOM节点可能会破坏另一个组件中d＆d文件删​​除功能。 +1在库中修复此问题

也许有一些快速的解决方案，可以通过一些道具链以某种方式指定dr​​opEffect？

我最终将@silvainSayduck分支用于HTML5后端。 这个对我有用。 可惜这个bug没有直接在react-dnd中修复，但是至少有一种解决方法

有机会很快解决这个问题？ @silvainSayduck您可以打开拉动请求进行修复吗？

我从我的仓库中创建了一个拉取请求，不确定是否有什么帮助（因为我仍然不知道注释掉一行是否有不希望的副作用，或者即使它解决了所有用例的问题）。

1239

@darthtrevino您介意为此项目做出贡献吗？

看一下PR，看起来很合理，我只需要验证它是否与示例无关即可

合并于＃1240

非常感谢@darthtrevino！ 什么时候将在npm版本中发布？

归根结底，当我有时间参加这个项目时，我通常的工作流程是遍历一批PR，然后发布。

@darthtrevino在当前版本中可用吗？ 什么时候可用？

我相信这是当前版本，是的。 让我知道你是否遇到问题

@darthtrevino谢谢，可以使用。

我遇到了同样的问题。 考虑到嵌套拖放区的概念，我最终将我的uploading-component包裹在div中，并在该div中添加了onDragOver属性，这只是停止了传播。 对于我来说，这似乎可以正常工作，这是示例（我正在使用Filepond）：

 handleDragOver (event) {
    console.log('dragged over ', event.dataTransfer)
    event.stopPropagation()
  }

  render () {
    return (
      <div onDragOver={this.handleDragOver}>
        <FilePond />
      </div>
    )
  }

但是，不喜欢react-dnd会对其他组件的d＆d功能造成很大影响的想法。 这似乎是一个巨大的不幸，在某些组件中，将react-dnd用于d＆d DOM节点可能会破坏另一个组件中d＆d文件删​​除功能。 +1在库中修复此问题

也许有一些快速的解决方案，可以通过一些道具链以某种方式指定dr​​opEffect？

在handleDragOver上添加event.stopPropagation() [Dropzone]解决了我的问题。 谢谢@vileppanen

这个线程挽救了我的生命

对于遇到此问题的用户，其中<Dropzone />在react-dnd组件中，可以使用相同的解决方案-将<Dropzone />包裹在<div onDragOver={e=> e.stopPropagation() />并在其中将onDragOver用于停止传播。