React Fragments म्हणजे काय र तिनलाई किन प्रयोग गर्नुहोस्?

Question

Accepted Answer

एक कम्पोनेन्टले **एक root element** फिर्ता गर्नुपर्छ, तर तपाइँ अक्सर यो नियम पूरा गर्न मात्र अतिरिक्त wrapper `

` थप्न चाहनुहुन्न (यसले CSS layouts जस्तै flex/grid वा HTML structures जस्तै tables तोड्न सक्छ)। **Fragment** children लाई **कुनै पनि** DOM node थप्न बिना समूहबद्ध गर्छ। ```jsx function TableRow() { return ( <> {/* Fragment — produces NO extra element in the DOM */} Name Email ); } ``` यदि तपाइँले यहाँ `

` प्रयोग गरे भने, तपाइँ अमान्य HTML (`

…`) पाउनुहुन्छ, र टेबिल टुट्छ। Fragment केवल दुई `` हरूलाई रेन्डर गर्छ। ## छोटो विरुद्ध पूर्ण syntax ```jsx <>... // short syntax (most common) // full syntax — needed when you must pass a key ... ``` **fragments को सूची** रेन्डर गर्दा पूर्ण फार्म प्रयोग गर्नुहोस्, किनभने छोटो `<>` `key` लिन सक्दैन: ```jsx {items.map(item => (

{item.term}

{item.def}

))} ``` ## यो किन महत्त्वपूर्ण छ Fragments ले DOM लाई स्वच्छ राख्छ ("wrapper div soup" छैन), semantic/layout-sensitive structures टुट्नबाट बचाउँछ, र node count लाई अलिकति घटाउँछ — सबै शून्य runtime लागत सहित।