Reactインラインスタイル - スタイルプロパティは、文字列ではなく、スタイルプロパティから値へのマッピングを期待しています質問する

Reactインラインスタイル - スタイルプロパティは、文字列ではなく、スタイルプロパティから値へのマッピングを期待しています質問する

React アプリケーションでインライン スタイルを設定しようとしています。この場合、span の場合:

<span className="myClass" style={{float : 'left', paddingRight : '5px'}} > </span>

React は次のように教えてくれます:

キャッチされない不変違反:styleプロパティは、文字列ではなく、スタイルプロパティから値へのマッピングを期待しています。たとえば、JSX を使用する場合、style={{marginRight: spaces + 'em'}} です。この DOM ノードは、`SentenceView によってレンダリングされました。

それが何を意味するのかよく分かりません。

PS: さまざまなバージョンを試してみましたが、paddingRight: 5も も もpaddingRight: 5 + 'px'試しましたpaddingRight : 5pxが、成功しませんでした。

ベストアンサー1

使用 "スタイル s " スタイルの代わりに小道具

<span className="myClass" style={{float : 'left', paddingRight : '5px'}} > </span>

以下は、W3Schools の優れたリファレンスです。スタイル情報を持つオブジェクトを作成し、それをスタイル属性で参照する方法も示されています。CSS を使用して React をスタイル設定する方法のリファレンス

おすすめ記事