Тэрнарны аператар у JSX

Як вы ўжо ведаеце, унутры фігурных дужак можна выконваць JavaScript код. На самой справе гэты код можа быць не любым, а толькі самым простым.

У прыватнасці, умовы if там ужываць нельга. Назамен варта карыстацца скарочанымі варыянтаў умоваў.

Давайце ў залежнасці ад значэння канстанты show вывядзём адзін ці іншы тэкст. Выкарастаем для гэтага тэрнарны аператар:

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

Можна працаваць не толькі з тэкстамі, але і з тэгамі:

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

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