将jQuery插件与React集成
我在我的React App中使用jQuery nestable插件 https://dbushell.com/Nestable/ 。 我知道在React中使用jQuery时会出现问题。
jQuery nestable解决了我的业务需求，无法找到反应拖动/嵌套组件的确切要求。 所以我使用了这个jQuery插件。
真正的问题是：在使用这个jQuery插件拖动一个元素时，它会克隆DOM，除此之外一切都在做出反应。
初始化了jQuery可嵌套function，如下所示：
componentDidMount() { this.$node = $(this.nestable); // this.nestable is a ref this.$node.nestable({ group: 1, maxDepth: 4, expandBtnHTML:"", collapseBtnHTML:"" }); } 上面的代码将让我在所有其他DOM元素中拖动group2，如下图所示：
group2是这里的可拖动元素。
拖动后，我可以看到group2出现了两次，我猜jQuery插件克隆拖动的元素，如下所示：
在开发人员工具中： 
但在反应开发人员工具中，我可以看到DOM是正确的。 
我不知道，如何纠正这个问题。 我无法在此更新完整代码，因为代码库很大。
在反应开发工具中，我可以看到DOM是正确的，而在本机DOM中则不行！
是否可以在setState之后用虚拟DOM替换本机DOM，或者是否可以对jQuery处理的跟踪DOM做出反应？
我接受@ Patrick Evans的评论，我在这里寻找一个解决方案或者像jQuery nestable这样的基于反应的组件。
对此有任何帮助将有所帮助。
这里有一个hacky解决方案：
在Nestable，你有改变事件。 因此，您将列表的顺序保持为组件状态，并且在拖放元素时可以更新状态，并且应该重新呈现列表。
请注意，您可以使用列表元素中的键来优化它。
我相信这会解决你的问题。
React-nestable似乎与jQuery插件具有相同的行为，可以为您节省很多麻烦。 将jQuery与React混合在我的经验中非常容易造成麻烦。