【react】cssでプロパティにハイフンを付けるとエラーになる

  • 2019年5月7日
  • CSS

reactでのcssの扱い方が少し雑になっていたのでここらで少し復習します・・・。今回はtips of tipsといってもいいくらい小さなこと

ですががっかりしないでくださいまし。

タイトルの通りreactでcssをいじっていたのですが、text-alignを追加しようとしたらcan,t resolve text-alignでエラーを受けました。

通常htmlに書くcssってハイフンって付くよな?と思い上書き保存してもう一回ビルドするもまたも同じエラー・・・。

reactで書く時はなんかの作法があるのかな?と思いながらも試しにtextAlignで書いてみたらなんとビルド成功。なん・・・だと・・・。

もしかしたらハイフンが付くプロパティは全て抜いて書き出す必要があるのかもしれませんね。

これまたなかなか載っていないのでここでこっそり載せておきます。同じ悩みでいらいらしている人の役に立ちますように・・・。

 

ダメな例↓

</pre>
newsText:{
text-align:"center",
}
<pre>

 

良い例↓


newsText:{
textAlign:"center",
}
</pre>
<pre>

>株式会社シーポイントラボ

株式会社シーポイントラボ

TEL:053-543-9889
営業時間:9:00~18:00(月〜金)
住所:〒432-8003
   静岡県浜松市中央区和地山3-1-7
   浜松イノベーションキューブ 315
※ご来社の際はインターホンで「316」をお呼びください

CTR IMG