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 নয়)।
যখন যুক্তি জটিল হয়, পাঠযোগ্যতার জন্য return-এর আগে উপাদান গণনা করুন:
let content;
if (error) content = <Error />;
else if (loading) content = <Spinner />;
else content = <List items={items} />;
return <div>{content}</div>;
এটি JSX কে সমতল রাখে এবং সিদ্ধান্ত গ্রহণের যুক্তি স্পষ্ট রাখে।
বিস্তারিত উত্তরসহ IT ইন্টারভিউ প্রশ্নের একটি লাইব্রেরি — জুনিয়র থেকে সিনিয়র পর্যন্ত।
দান করুন