Javascript Div不在<；之间转换文本；b></b>；将html标记转换为真正的粗体文本

我在javascript中动态创建一个字符串，然后将其发送到reactjs组件内部呈现。例如：

首先创建字符串，然后渲染

let displayText = "<b>Name: </b>" + this.name;
then 
render() {
   return (
 <div class={test-str}>
          {displayText}
        </div>
)

}

let displayText=“Name:”+this.Name；
然后
render（）{
返回(
{displayText}
)
}

但问题是，在页面上，它将其改为

“Name:TestName”

如何将那些

转换为粗体

---

仅供参考：-我正在其他一些Util库中创建此字符串。在组件外部调用返回此字符串的util。

您可以像这样使用危险的LySetinerHTML：

render() {
   return (
        <div class={test-str}>
          <div  dangerouslySetInnerHTML={{__html: displayText}} />
        </div>
    )
}

let displayText = (<b> Name: </b> {this.name});

render（）{
返回(
)
}

或者您可以像这样使用JSX：

render() {
   return (
        <div class={test-str}>
          <div  dangerouslySetInnerHTML={{__html: displayText}} />
        </div>
    )
}

let displayText = (<b> Name: </b> {this.name});

let displayText=（名称：{this.Name}）；

---

JSX允许我们在React中编写HTML。JSX使在React中编写和添加HTML变得更容易

您必须这样做：

***（名称：{this.Name}）****，它将呈现标记。
将（）用于呈现标记，并确保您具有类似（）的主容器。
我没有问题呈现名称值，它不是呈现名称：粗体，而是呈现标记。您看到了以下内容：这里您要说的是，生成如下字符串：let displayText=（名称：{this.name}），这是不可接受的。因为我必须首先动态生成字符串并在渲染中使用该字符串。我希望你能明白。请查看仅供参考：然后阅读