JSX ஆனது எந்த JavaScript வெளிப்பாடையும் முன்னிலைப்படுத்த முடியும், எனவே நிபந்தனாபூர்வ முன்னிலைப்படுத்தல் என்பது { } உள்ளே பயன்படுத்தப்படும் சாதாரண JS மாত்திரம்.
jsx
() {
(
);
}
JSX ஆனது எந்த JavaScript வெளிப்பாடையும் முன்னிலைப்படுத்த முடியும், எனவே நிபந்தனாபூர்வ முன்னிலைப்படுத்தல் என்பது { } உள்ளே பயன்படுத்தப்படும் சாதாரண JS மாত்திரம்.
() {
(
);
}
cond && <X/> — cond உண்மையாக இருந்தால் <X/> ஐ முன்னிலைப்படுத்து, இல்லையெனில் எதுவுமில்லை. "காட்ட அல்லது மறை" க்கு சிறந்தது.cond ? <A/> : <B/> — இரண்டு கிளைகளுக்கு இடையில் தேர்ந்தெடு.null ஐ திரும்பி அனுப்பு எதுவுமே முன்னிலைப்படுத்த வேண்டாம்.&& எண்களுடன்{count && <Badge n={count} />} // ❌ when count === 0, React renders "0" on screen!
{count > 0 && <Badge n={count} />} // ✅ guard with a real boolean
இது நிகழ்கிறது ஏனெனில் 0 && x 0 ஆக மূல்யமிடப்படுகிறது, மற்றும் React எண் 0 ஐ முன்னிலைப்படுத்துகிறது (ஆனால் false/null/undefined அல்ல).
லாஜிக் சிக்கலாக இருந்தால், வாழ்நாளுக்கு முன்பு உপাদனத்தை பிழையின்றி கணக்கிடு:
let content;
if (error) content = <Error />;
else if (loading) content = <Spinner />;
else content = <List items={items} />;
return <div>{content}</div>;
இது JSX ஐ தட்டையாக வைத்து முடிவெடுக்கும் லாஜிக் தெளிவாக வைத்திருக்கிறது.
விரிவான பதில்களுடன் கூடிய IT நேர்காணல் கேள்விகளின் நூலகம் — Junior முதல் Senior வரை.
நன்கொடை