使用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属性