如何在dangerallySetInnerHTML内容中呈现反应组件？

Question

从服务器获取HTML内容并在特定元素内使用dangerouslySetInnerHTML在UI上呈现。

我的问题是使用dangerouslySetInnerHTML之类的标识符在id内容中渲染React组件。

Answer 1

虽然可能，但这是一种错误的方法。 dangerouslySetInnerHtml需要一个字符串，因此您必须将React组件呈现为字符串并将其插入HTML字符串中，然后再进行设置...或在呈现DOM之后使用钩子来操作DOM，但这与反应最佳实践；您应该让React管理DOM及其更改。

由于您提到要从服务器取回HTML，所以建议在此进行更改。而不是从服务器返回HTML，而是返回JSON数据。在客户端，您可以完全不使用dangerouslySetInnerHtml来获取JSON并填充需要呈现的React组件。

在AJAX的早期，返回HTML以响应AJAX调用是很常见的，但是现在正是出于这些原因而返回“原始”数据的标准做法。如果您的某些HTML是在客户端定义的，而在某些服务器端是定义的，那么在客户端上管理DOM脚本和交互性将是非常困难的。

Answer 2

dangerouslySetInnerHtml无法呈现反应组件，因为它不接受组件。它仅接受html字符串。