Tai*_*aig 12 javascript css escaping reactjs react-jsx
我有一个具有data-icon属性的组件.例如,此属性的值应该是󰃼ss可以通过它呈现它content: attr( data-icon );.
然而,无论我尝试什么:React继续逃避&.即使我提供了正确的unicode角色\u0026#xf00f.
有没有办法阻止React搞乱这个价值?除了危险地设置内部html,因为我不想添加另一个包装器.
零件
define( [ 'react', 'util' ], function( React, Util )
{
return React.createClass(
{
render: function()
{
//var amp = '\u0026',
var amp = String.fromCharCode( 38 ),
// Util.icons[x] returns a String, such as "f00f"
code = amp + '#x' + Util.icons[this.props.name] + ';';
return (
<i data-icon={code}>
{this.props.children ? <span>{this.props.children}</span> : null}
</i>
);
}
} );
} );
Run Code Online (Sandbox Code Playgroud)
用法
<Widget.Icon name="add" />
Run Code Online (Sandbox Code Playgroud)
产量
<i data-icon="&#xf0fb;" data-reactid=".170lse36465.7.0"></i>
Run Code Online (Sandbox Code Playgroud)
Tai*_*aig 16
好吧,我刚刚意识到,对于我的特定用例,我可以简单地逃脱:
<i data-icon={String.fromCharCode( "f00f" )} />
Run Code Online (Sandbox Code Playgroud)
https://github.com/facebook/react/issues/3769
| 归档时间: |
|
| 查看次数: |
10788 次 |
| 最近记录: |