Operator Ternar di JSX

Seperti yang sudah Anda ketahui, di dalam kurung kurawal kita dapat mengeksekusi kode JavaScript. Sebenarnya kode ini tidak bisa sembarang, hanya yang paling sederhana.

Khususnya, kondisi if tidak dapat digunakan di sana. Sebagai gantinya, kita harus menggunakan variasi kondisi yang disingkat.

Mari kita tampilkan satu teks atau teks lainnya tergantung pada nilai konstanta show. Mari gunakan operator ternar untuk ini:

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

Kita tidak hanya dapat bekerja dengan teks, tetapi juga dengan tag:

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

Diberikan kode berikut:

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

Jika dalam age tertulis lebih dari 18 tahun, maka di dalam teks tag div tunjukkan kepada pengguna sebuah paragraf dengan satu teks, dan jika kurang - dengan teks lainnya.