reactjs - React、html 字符串和组件

Question

假设我们有一个 HTML 字符串。它看起来像这样：

"<p>Australia is the capital of Canada<footnote>No, it isn't</footnote></p>
 <p>Australia's most famous animal<footnote>There are no animals in 
 Australia</footnote> is the panda</p>"

现在假设我们想要构建一个可以将该字符串转换为 HTML 的 react 组件，将所有脚注元素从<p>标签中拉出，然后用一个显示有脚注的标记替换它们。像这样：

<p>Australia is the capital of Canada<a href="footnote-1">[1]</a></p>
<p>Australia's most famous animal<a href="footnote-2">[2]</a>is the panda</p>

...
<span id="footnote-1">No, it isn't</span>
<span id="footnote-2">There are no animals in Australia</span>

将这些脚注拉出并替换它们的“反应方式”是什么？有没有一种“反应方式”来进行这种操作？我目前的实现是这样的：

shouldComponentUpdate() {
  return false;
}
// a whole lot of vanilla javascript

这并不理想。

我意识到这个问题的答案可能相当冗长，所以我很乐意只提供一些一般性提示。

标签： reactjs