react从dangerouslySetInnerHTML返回标记

Question

我有从所见即所得编辑器中保存的html，并从数据库中提取，我需要显示我通常做的内容

 <div dangerouslySetInnerHTML={{__html: content}} />

但现在我需要在另一个组件中使用格式化内容，

所以我希望如果有一个函数可以返回这样的标记var formattedContent =getMarkup(Content)//希望它能做dangerouslySetInnerHTML所做的事情

<Highlight search="Condominium" >
    {formattedContent}
</Highlight>

因为这不管用

<Highlight search="Condominium" >
      <div dangerouslySetInnerHTML={{__html: content}} />
</Highlight>

任何帮助我都很感激，因为我几乎要在这一天多的时间里苦苦挣扎。

我在上面尝试的是

Npmjs.com/package/react- highlight --它会突出显示匹配的单词，但我不仅需要突出显示纯文本，还需要突出显示html

Answer 1

HTML值是一个以__html为键、以dangerouslySetInnerHTML内容为值的对象。

<Highlight search="Condominium" >
    <div dangerouslySetInnerHTML={{__html: content}} />
</Highlight>

更新：

Highlight组件已经有一个属性innerHTML。在这种情况下，您不需要使用dangerouslySetInnerHTML。

来自官方Documentation

<Highlight innerHTML={true}>{content}</Highlight>