JSXにおける三項演算子

すでにご存知のように、波括弧の中では JavaScriptコードを実行できます。実際には、任意のコードではなく、最もシンプルなものだけが可能です。

特に、条件式ifはそこで使用できません。代わりに、条件式の短縮版を使用する必要があります。

定数showの値に応じて、1つのテキストまたは別のテキストを出力してみましょう。このために三項演算子を使用します：

function App() {
	const show = true;
	
	return <div>
		{show ? 'text1' : 'text2'}
	</div>;
}

テキストだけでなく、タグでも作業できます：

function App() {
	const show = true;
	
	return <div>
		{show ? <p>text1</p> : <p>text2</p>}
	</div>;
}

次のコードがあります：

function App() {
	const age = 19;
	
	return <div>
		
	</div>;
}

ageに18歳以上が記録されている場合、 divタグのテキストでユーザーに 1つのテキストを含む段落を表示し、それ以下の場合は別のテキストを含む段落を表示してください。