React behält das Amp-Zeichen (&) in Attributen

Question

Ich habe eine Komponente mit einem data-icon Attribut. Der Wert dieses Attributs sollte beispielsweise &#xf00f lauten, so dass css es über content: attr(data-icon); rendern kann.

Wie auch immer ich es versuche: React bleibt weiterhin auf &. Auch wenn ich das richtige Unicode-Zeichen \u0026#xf00f zur Verfügung stelle.

Gibt es eine Möglichkeit zu stoppen Reagieren von diesem Wert zu verwirren? Außer dem gefährlichen Setzen von innerem HTML, da ich keinen weiteren Wrapper hinzufügen möchte.

Komponente

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> 
      ); 
     } 
    }); 
}); 

Nutzungs

<Widget.Icon name="add" /> 

Ausgabe

<i data-icon="&amp;#xf0fb;" data-reactid=".170lse36465.7.0"></i> 

Answer 1

Nun, ich habe gerade realisiert, dass für meine

<i data-icon={String.fromCharCode("f00f")} /> 

https://github.com/facebook/react/issues/3769