reactjs - react : Integrate external libraries that have lots of DOM building in js

Question

我使用的一些非 React 库使用 JavaScript 执行一些 DOM 生成。理想情况下，我希望这发生在 React 的渲染周期中，但 React 没有实现某些 DOM 函数。

即。一个库想要创建一个用于显示标题的片段(使用 jQuery)，该片段最终会调用 document.createDocumentFragment。

一个简单的解决方法是让库在组件安装或更新时进行渲染。但我正在尝试使用虚拟 DOM 进行渲染。是否有更好的方法来重新创建或移植库？

Answer 1

您需要一个“门户”。看看https://github.com/ryanflorence/react-training/blob/gh-pages/lessons/05-wrapping-dom-libs.md这很好地解释了解决方案，如下所示:

方法论:

1. DOM 库通常操作 DOM
2. React 尝试重新渲染，发现了一个与上次不同的 DOM，结果吓坏了
3. 我们通过破坏渲染树然后重新连接 lib 操作的 DOM 来向 React 隐藏 DOM 操作。
4. 我们组件的使用者可以留在 React-land。