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 टैग के टेक्स्ट में उपयोगकर्ता को एक टेक्स्ट वाला पैराग्राफ दिखाएं, और यदि कम है - तो दूसरे वाला।