การใช้เงื่อนไขใน JSX

เรามาทำให้ขึ้นอยู่กับเนื้อหาของค่าคงที่ show บนหน้าจอ แสดงผลข้อความหนึ่งหรืออีกข้อความหนึ่ง:

jsxfunction App() {
  let text;
  const show = true;
  
  if (show) {
    text = 'text1';
  } else {
    text = 'text2';
  }
  
  return <div>
    {text}
  </div>;
}

สามารถทำให้ตัวแปรเก็บ ไม่ใช่แค่ข้อความ แต่เป็นแท็ก:

jsxfunction App() {
  let text;
  const show = true;
  
  if (show) {
    text = <p>text1</p>;
  } else {
    text = <p>text2</p>;
  }
  
  return <div>
    {text}
  </div>;
}