我有这样的组件:
import React from 'react';
import Autolinker from 'autolinker';
class Comment extends React.Component{
constructor(props){
super(props);
}
render(){
return <li className="media comment">
<div className="image">
<img src={this.props.activity.user.avatar.small_url} width="42" height="42" />
</div>
<div className="body">
<p>
<strong>{this.props.activity.user.full_name}</strong>
</p>
</div>
<div>
<p>
{Autolinker.link(this.props.activity.text)}
</p>
</div>
</li>;
}
}
export default Comment;
Autolinker返回给我一个字符串值,类似于这样:
"So basically <a href="http://www.silastar.com/dev-sila" target="_blank">silastar.com/dev-sila</a> is perfect and works correctly?"
如何将此字符串转换为HTML JSX,以便锚链接显示为链接而不是纯文本?
this.props.activity.text
进行消毒处理,则此解决方案会带来XSS安全威胁。常见的消毒方法会不幸地扭曲一些Autolinker的URL。 - Radek Matěj