Javascript React-危险的HTML显示为纯文本

我已经创建了一个React应用程序，可以显示职位公告。当我单击列表中的某个职位时，会显示该职位的详细信息

我试图以源代码处格式化的方式显示职位的正文。为此，我尝试使用以下代码：

<div id="apply-now" className="apply-section">
    <h3>How to apply.</h3>
    <div dangerouslySetInnerHTML={{ __html: currentJob.description }}></div>
</div>

如何申请。

但是，当呈现组件时，内容不会格式化，而是以纯文本显示，而没有适当的格式

以下是一个尚未格式化的示例：

“申请”一词应为粗体，网站链接应为实际链接，如“点击此处获取申请表”链接

我从API调用返回的数据与上面的相同：

加入我们吧我们期待您通过“应用程序”提交申请。您的联系人：拉尔夫·乌尔曼电话：089/5511 333783

^^即使在StackOverflow上面，它也能工作！但我的应用程序无法让它工作

---

为了解决这个问题，我已经绞尽脑汁好几个小时了，我甚至不明白为什么它不起作用。

这听起来像是一个算法挑战。对不起，我认为这可以用一种优雅的方式完成，但regex是更好的选择

使用正则表达式匹配两个下划线之间的任何内容

在每个匹配中，替换并删除下划线，并将每个元素包装在

strong

标记中

const mdBoldToStrong=（文本）=>{
const surroundingUnderscores=new RegExp（/_;（.*？）\u_;/g）
返回文本
.替换（围绕分数）（单词）=>{
返回“${word.replace（/\ug，”）}`
})
}
console.log（mdBoldToStrong（“应用程序”）
log（mdBoldToStrong（'Text\uuu Application\uuuu Text\uuuu'））
console.log（mdBoldToStrong（“文本应用程序文本”）

那么你的问题是如何设置它的样式？@KonstantinModin是的，与上面引用的文本中显示的方式相同。

\uuuuuuuuuuuuuuu

不是html的粗体，这是标记。可以使用一些东西来正确地呈现标记，或者使用某种替换逻辑来替换附加在单词前面的

\uuuuuuuuuuuu

和

作为

附在一个单词的末尾。有一些库你可以尝试，等等，我不能为它们中的任何一个的性能或开发人员体验说话，所以我不能推荐一个。正确的，你收到的是，这与HTML完全不同。这不是包装了所有方面吗拆分为强标记？给定

“Text\uuu Bold\uuuu Text”

您将得到

“TextBoldText“

@JacobSmit您是对的。看起来这可能比看起来更具挑战性，如果只需要大胆的造型，这应该可以做到。如果需要其他标记样式，您可能仍然希望查看某种形式的标记解析器。