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

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

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

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

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

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

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

Дадзены наступны код:

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

Калі ў age запісана больш 18 гадоў, то ў тэксце тэга div пакажыце карыстальніку абзац з адным тэкстам, а калі менш - то з іншым.