React继续转义属性中的放大器字符(&)

Tai*_*aig 12 javascript css escaping reactjs react-jsx

我有一个具有data-icon属性的组件.例如,此属性的值应该是&#xf00fcss可以通过它呈现它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="&amp;#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