JSX može renderirati bilo koji JavaScript izraz, tako da je uvjetno renderiranje samo normalan JS korišten unutar { }.
jsx
() {
(
);
}
JSX može renderirati bilo koji JavaScript izraz, tako da je uvjetno renderiranje samo normalan JS korišten unutar { }.
() {
(
);
}
cond && <X/> — renderira <X/> kada je cond istinit, inače ništa. Odličan za "prikaži ili sakrij".cond ? <A/> : <B/> — biranja između dva grana.null za renderiranje ničega.&& s brojevima{count && <Badge n={count} />} // ❌ when count === 0, React renders "0" on screen!
{count > 0 && <Badge n={count} />} // ✅ guard with a real boolean
Ovo se događa jer 0 && x evaluira na 0, a React renderira broj 0 (ali ne false/null/undefined).
Kada logika postane kompleksna, izračunajte element prije vraćanja za čitljivost:
let content;
if (error) content = <Error />;
else if (loading) content = <Spinner />;
else content = <List items={items} />;
return <div>{content}</div>;
Ovo čini JSX ravnim i logiku odluke jasnom.