Q&A
やりたいことができていない、について具体的な状況を説明してみてはいかがでしょうか
ついでに、
`${
↑これなんですか？
開発環境
TypeScript/Reactを使っています。
やりたいこと
reactで以下の条件によってCSSの切り分けをしたいです。
条件
・配列要素が１以上の場合
＿・イメージデータが３の場合
＿＿CSS1
＿・それ以外の場合
＿＿CSS2
・それ以外の場合
＿・イメージデータが３の場合
＿＿CSS1
＿・それ以外の場合
＿＿CSS2
現在のコード
<div className={`${配列.length < 1 ? (イメージデータ === 3 ? "CSS1" : "CSS2") : ("CSS2")`}>
三項演算子で書いていましたがやりたいことができていなく、、、
条件の、それ以外の場合の条件分岐が現在できていない状態です。今のままの書き方だと冗長な記述となってしまう気がしています。
もっと賢い書き方あれば教えてください。
ありがとうございます。
コードとできていないことについて詳細に記載して修正しました。
`${ については現場の方が使用しておりそのまま使っていました。。
JavaScript ではバッククォートでくくった文字列 `〜` の中に ${〜} で変数や式を展開できますが、バッククォートの中身が全部それ `${〜}` だと単に 〜 と書いたのと同じことになりますね。
あと、三項演算子が長くて訳わからなくなってるなら、いったん変数に代入して使えば良いのでは。それなら if 文も使えるし。
ひとつ{}が閉じていないように見えるのは、私が知らないだけでそういうものだったりするんですか？
回答1件
0
変数を立てて、「条件」以下の内容をそのままif-elseに起こして変数に代入する、というのが、わかりやすさではいちばんいいかと思います。
三項演算子は、コードの文字数を減らすのと同時に可読性も落としてしまいます。
投稿2022/01/07 12:22
総合スコア146018
あなたの回答
tips
プレビュー
