React で Style 属性を使用する方法
現在、Tailwind の可能性を最大限に活用しているとします。また、Tailwind 要素も使用し、既製のコンポーネントをコピーして貼り付けるだけであるとします。私もほとんどの場合そうしていますが、単純に CTRL+C と CTRL+V を押すことができない瞬間があります。
スタイル属性に対応します。これは特に追い風でよく見られます。これは基本的に、className のインライン スタイル設定とは別に、コンポーネントに必要な追加設定のようなものです。
通常、style は background-color や background-image などを追加するために使用されます。詳細については、tailwind の公式ドキュメントを参照してください。https://tailwindcss.com/docs/background-attachment
普段はこんな感じです。
ここで、コードをコピーして貼り付けるだけで、このようなエラーがスローされます。
スタイルをさらに調整する必要があります。これは当然のことながら、反応ドキュメントでも説明されていましたが、何らかの理由で私のようにそれを見逃した可能性があります。https://reactjs.org/docs/dom-elements.html#style
TLDR、背景色のように単純にハイフンを使用することはできません。これをキャメルケースに変更して backgroundColor にする必要があります。
background-color から BackgroundColor へ、
background-position から backgroundPosition
background-image から backgroundImage
それだけでなく、すべてのスタイルをカプセル化している引用符を削除し、二重中括弧に置き換えて、このように値を引用符で囲む必要もあります。
それでおしまい！他に何もする必要はありません。これで、コードは完全に機能します。テールウィンド要素からコードをコピーして貼り付けるだけで、これが現在の私のプロジェクトの外観です。（本当におすすめです。https://tailwind-elements.com/)
楽しむ！読んでくれてありがとう！
提案された投稿
私が最もよく使用するコーディング リソース
今週、毎日のメールリストのメンバーからメールを受け取りました。彼らは次のことを知りたかったのです。毎日、毎週、毎月どのリソースにアクセスしていますか? 素晴らしい質問です！私のワークフローと使用している主なリソースについての洞察を共有したいと思います。
関連記事
ドメイン名に関する情報の検索
Brian P. Hogan 著『Small, Sharp Software Tools』からの抜粋
facebook.com にリクエストを送信すると、コンピュータはドメイン名を検索してそのドメイン名を IP アドレスに変換し、コンピュータが接続できるようにします。
仕事週間で学ぶことはあなたが思っている以上に重要です
私たちは、自分にとって良いとわかっていることを実行するのに苦労していることによく気づきます。大切な人に愛していると伝えることから、海賊のように話すことを忘れないことまで、すでにそうしたことを行っているため、1日、1週間、または1か月のイベントは必要ないと主張する人が常にいます。
カウボーイの嘘
巨大企業はいかにしてアメリカ国民にひどい嘘を売ったのか
西のなだらかな丘陵地帯では、太陽の最初の光が平原の曇った草を照らす、まばゆいばかりの金色の朝です。真っ黒で巨大な穏やかなアンガス牛の群れが日の出を背景にシルエットを描き、誰もがよく知っている場所へ人里離れた道を進んでいます。朝食バー。