脳汁portal

アメリカ在住(だった)新米エンジニアがその日学んだIT知識を書き綴るブログ

ReactのJSX構文内でclass属性を設定する場合

render: function() {
    return (
        <div class='foo'>Hello React!!</p>
    );
}

上記のように直接class属性を指定しようするとエラーが出て怒られます
Warning: Unknown DOM property class. Did you mean className?

これはclassという文字がReact側で予約後として他で使われているために発生するエラーです。
解決法もその後に書いてありますが、classNameを使えば解決します。

render: function() {
    return (
        <div className='foo'>Hello React!!</div>
    );
}

また、idはそのまま使えます

.
.
        <div id='bar'>Hello React!!</p>
.
.