Question

想象一下，您创建了一个Web框架，可帮助您快速为客户创建博客。为了这篇文章的缘故，每次都使用相同的博客模板，其内容发生了变化。您是React应用，它是以下的简单结构[其中Content状态每次都在变化]

<App>
  <Navigation/>
  <Content/>
</App>

构成框架的原因是您拥有包含HTML的XML文件。每个XML文件代表一个博客文章。该应用程序从XML文件中提取所有HTML，并通过“博客文章”数组将其置于应用程序状态。根据应用程序的状态，阵列中的特定条目将显示在“内容...”中。

内容的状态有一个名为“ html”的字段，该字段保存要以字符串形式注入的HTML。 [您必须危险地使用SetInnerHTML]

这个概念很好用，我现在有一个版本。但是，假设您有一个React组件要添加到每个博客文章中。假设您要将组件添加到特定部分的特定博客文章中。您想添加道具等等。现在，这将以危险地SetInnerHTML退出窗口

这就是我一直在努力寻找最佳方向的地方。我现在唯一的想法是：

由于您现在将使用XML编写JSX，因此只需使每个博客都发布自己的组件即可。您将拥有... etc，然后如果this.state.currentPost === 1，则显示BlogPost1，同样。但是，您将不得不拥有大量的if语句，具体取决于您拥有的博客文章数量，而且每次有新博客文章时都必须添加它不是理想的选择

Answer 1

当我阅读您的问题的标题时，我感到好奇，发现该库将XML解析为React组件：xml-to-react。但这不是您要的。

当您想在HTML字符串的中间使用组件时，我建议：react-remarkable。该组件将其子级（带有markdown / html / react的字符串）编译为反应节点。

其文档中的示例：

$aduser = get-aduser -f samaccountname -eq $username
if($true){
    write-host "username exist"
}
else{
     write-host "user doesn't exist"
}

如何从XML创建注入React组件

1 个答案: