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:

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

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

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

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