react中使用innerHTML改如何使用

使用dangerouslySetInnerHTML属性

<div dangerouslySetInnerHTML={{__html:'<a href="http://https://segmentfault.com/">test url</a>'}}/>

使用情景：

接收到一个字符串，希望在字符串中有链接的时候可以实现点击跳转的功能

1、首先识别到字符串中的链接转换成a标签

 var urlToLink = function (str) {
    var re = /(http:\/\/|https:\/\/)((\w|=|\?|\.|\/|\&|-)+)/g;
    str = str.replace(re, function (website) {
      return "<a href='" + website + "' target='_blank'>" + website + '</a>';
    });
    return str;
  };

 2、这时返回的文本依然是一个字符串，需要处理成浏览器可以识别的超链接，就需要用dangerouslySetInnerHTML属性