web-dev-qa-db-fra.com

Générer un style de police de caractères intégré avec ReactJS

J'essaie de faire quelque chose comme ça dans ReactJS:

var MyReactClass = React.createClass({
    render: function() {
        var myDivText = "Hello!";
        var myFontSize = 6; //this is actually something more complicated, I'm calculating it on the fly
        var divStyle = {
            font-size: {fontSize + 'px !important;'},
        };
        return (<div style={divStyle}>{myDivText}</div>);
   }
});

Le problème est que je reçois cette erreur lorsque j'exécute mon code: "La construction du module a échoué: Erreur: Erreur d'analyse: Ligne 5: Jeton inattendu -" Apparemment, React n'aime pas que font-size comporte un tiret il. Comment puis-je contourner cela? Y a-t-il un moyen d'échapper à ce personnage pour réagir? Existe-t-il une propriété css différente qui réagit mieux qui fait la même chose?

Merci!

cssfont-sizereactjsinline-stylesreact-jsx
18
kat

Utilisez fontSize au lieu de font-size

la solution est de camelCase propriétés qui contiennent généralement un tiret

http://facebook.github.io/react/tips/inline-styles.html

Répondu à ma propre question :)

41
kat

J'utilise fontSize: nombre de pixels

0
Guille_2783

Comme https://reactjs.org/docs/dom-elements.html dit,
Nous devons supprimer '-' et les majuscules sauf le premier mot 

Exemple-
background-color as backgroundColor, 

La même chose sera applicable partout sauf quelques-uns 

aria-* and data-*

exemple- 

aria-label as aria-label

Ci-dessus a fonctionné pour moi!

0
S.Yadav