Reactjs 通过危险的HTML注入React门户和HTML

我有一个应用程序，用户可以从管理员那里接收消息。管理员在管理员面板上的WYSIWYG编辑器中创建消息，消息作为html字符串存储在数据库中，然后消息内容通过危险的html注入组件。消息中的HTML经过清理，因此只允许有标记和属性（没有脚本标记，标记上没有事件处理程序方法，等等）

一切正常，但现在我们必须向消息编辑器添加“表单”功能。表单是在“管理员”面板上的单独选项卡中创建的，然后可以通过将表单附加到邮件中来创建表单。在信息中是这样的

<div data-form-id="12"/>

表单id为空的div。现在，当消息显示在用户的应用程序上时，我应该处理此类div，并将其替换为从db获取的预期表单（表单不存储为html，而是存储为指定的json结构）

首先，我考虑过使用React门户，但读到应该使用它们来修改外部HTML元素，而不是React应用程序中的元素，在内部使用它们是不好的做法

有一些“正确”的方法来实现这样的目标，或者从一开始就是一个坏主意

应用于修改外部HTML元素，而不是React应用程序中的元素

这并不完全正确。当您希望将React树的元素呈现在React树之外的某个位置（也就是说，呈现到不受React控制的DOM中）时，可以使用React门户。React不控制使用

危险的LySetinerHTML

设置的DOM元素。我认为在特定情况下，你的解决方案是可以的。在删除“消息”之前，一定要小心删除门户，这样React不会试图将某些内容呈现为

null

，否则它应该可以工作