React 如何正常渲染一段HTML字符串

dangerouslySetInnerHTMl 属性

不少时候咱们作一个项目接口会返回一段 HTML 字符串文本，而后咱们把它解析渲染成正常的html，这是在项目中常见不能再常见的状况了，但是在 react 里边就有一个小小的插曲，在这里分享给同窗们；

因为react 项目中是 JSX 语法，JSX 防注入攻击使得大括号里的html代码所有变成字符串进行渲染，本人就遇到了这样的问题，（仍是渲染这段代码字符串文本，并无解析）

解决： 

<div dangerouslySetInnerHTML = {{__html:返回的html代码片断}} ></div>

原理：

1.dangerouslySetInnerHTMl 是React标签的一个属性，相似于angular的ng-bind；

2.有2个{{}}，第一{}表明jsx语法开始，第二个是表明dangerouslySetInnerHTML接收的是一个对象键值对;

3.既能够插入DOM，又能够插入字符串；