React中标签字符串强制转html解析的方法

React中标签字符串强制转html解析的方法

---

遇到的问题:在React中我们经常会请求数据并渲染到页面中间显示，我们可以直接使用更新state的方法，并使用tihs.state.(data)的方法进行渲染，但是我们有时候会遇到需要渲染html标签的字符串到页面中如果直接进行渲染我们得到的是html字符串，并不是我们想要的html标签。这个时候我们应该怎么办呢？

1. js原生方法

 var html="
这是需要渲染的标签字符串
"
 document.body.innerHTML = html

  
  
    
    
    
    

  
  
    
    
    
    

     
     
     
     
1
     
     
     
     
2
    
    
    
    

2. jquery方法

 var html="
这是需要渲染的标签字符串
"
 var parent = $('body');
 parent.html(html)

  
  
    
    
    
    

  
  
    
    
    
    

     
     
     
     
1
     
     
     
     
2
     
     
     
     
3
    
    
    
    

3. react中强制转为html解析的方法

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

  
  
    
    
    
    

  
  
    
    
    
    

     
     
     
     
1
    
    
    
    

在React中尽量少使用该方法，使用该方法容易受到XSS攻击

注意：便签内部必须为空，空格也不行。