Ternárny operátor v JSX
Ako už viete, vo vnútri zložených zátvoriek je možné vykonávať JavaScript kód. V skutočnosti tento kód nemôže byť ľubovoľný, ale len ten najjednoduchší.
Konkrétne, podmienky if tam použiť
nejde. Namiesto toho by ste mali používať skrátené
verzie podmienok.
V závislosti od hodnoty konštanty
show vypíšme jeden alebo druhý text. Použime
na to ternárny operátor:
function App() {
const show = true;
return <div>
{show ? 'text1' : 'text2'}
</div>;
}
Môžeme pracovať nielen s textami, ale aj s tagmi:
function App() {
const show = true;
return <div>
{show ? <p>text1</p> : <p>text2</p>}
</div>;
}
Daný je nasledujúci kód:
function App() {
const age = 19;
return <div>
</div>;
}
Ak je v age zapísaných viac ako 18 rokov,
tak v texte tagu div ukážte používateľovi
odsek s jedným textom, a ak menej - tak
s iným.