DangerouslySetInnerHtml() 在 React 中显示上一页的内容答案

【问题标题】：DangerouslySetInnerHtml() showing content from previous page in ReactDangerouslySetInnerHtml() 在 React 中显示上一页的内容
【发布时间】：2018-01-09 03:05:29
【问题描述】：

建立一个显示用户个人资料的网站。从一个配置文件更改为另一个配置文件时，配置文件描述与以前的用户配置文件数据卡住了。

例如

访问用户个人资料 1
用户个人资料描述为User profile 1 description
访问用户个人资料 2
用户个人资料描述为User profile 1 description User profile 2 description

我的代码都在我的组件的渲染函数中运行，所以当状态更新时应该重新渲染。

render(){
    return(
        <h4>Profile 1<h4>
        <p dangerouslySetInnerHTML={{__html: this.props.profile.description}} />
    )
}

【问题讨论】：

标签： html reactjs

【解决方案1】：

原来this.props.profile.description 是用<p> 标签包裹的HTML。这导致 p 标签嵌套在 p 标签中，从而导致本文所述的问题 - Nesting <p> won't work while nesting <div> will?

经验法则是永远不要在 <p> 标签上使用 dangerouslySetInnerHTML。

我花了很长时间才找到它的根本原因，并认为值得将它传递下去。

【讨论】：