React Native માં મુખ્ય ઘટકો શું છે?

Question

Accepted Answer

React Native **મુખ્ય ઘટકો**નો એક સમૂહ પ્રદાન કરે છે — જેમ કે **View**, **Text**, **Image**, **ScrollView**, **TextInput** — જે મૂળ UI તત્વો સાથે મેપ કરે છે. તે React Native UI ના મૂળભૂત બંધારણ બ્લોક્સ છે, જે વેબ HTML તત્વોની જગ્યાએ વપરાય છે. ## મુખ્ય ઘટકો (વેબ HTML તોલે) ```text React Native uses its OWN components (mapping to native views), NOT HTML: VIEW → a container (like a

) — the basic layout building block TEXT → display text (ALL text must be inside a , unlike web) IMAGE → display images (local or remote) TEXTINPUT → text input field (like an ) SCROLLVIEW → a scrollable container FLATLIST → an efficient scrollable LIST (for long lists — renders lazily) TOUCHABLEOPACITY / PRESSABLE → handle taps (touchable areas) BUTTON → a basic button ``` ## ઉદાહરણ ```jsx import { View, Text, Image, TextInput, TouchableOpacity } from 'react-native'; function Profile() { return ( {/* container (like a div) */} Ann {/* text MUST be in */} {}}> Submit ); } ``` ## વેબથી મુખ્ય તફાવતો ```text ✓ Use not

, not

/; ALL text must be in ✓ No CSS classes/files — STYLING via a style prop (JS objects, StyleSheet) — see styling ✓ Touchables/Pressable for interactions (not onClick on divs) ✓ FlatList for long lists (efficient) — not mapping over everything ``` ## તે શા માટે મહત્વપૂર્ણ છે મુખ્ય ઘટકોને સમજવું React Native વિકાસ માટે મૌલિક છે કારણ કે **તે દરેક React Native UI ના બંધારણ બ્લોક્સ છે** — તમે તેમને બનાવો છો ઇન્ટરફેસ બનાવવા માટે, તેથી તે જરૂરી મૂળભૂત જ્ઞાન છે. React Native તેના **પોતાના ઘટકો** પ્રદાન કરે છે જે મૂળ દૃશ્યો સાથે મેપ કરે છે (વેબ HTML તત્વોની જગ્યાએ), અને આવશ્યક બાબતોને સમજવું — **View** (કન્ટેનર, div જેવું), **Text** (બધા ટેક્સ્ટ માટે, અગત્ય નિયમ સાથે કે બધો ટેક્સ્ટ Text ઘટક માટે હોવો જોઈએ, વેબથી વિપરીત), **Image**, **TextInput**, **ScrollView**, **FlatList** (કાર્યક્ષમ લાંબી યાદીઓ માટે), અને touchables/**Pressable** (ટેપ સંભાળવા માટે) — કોઈપણ React Native UI બનાવવા માટે આવશ્યક છે. વેબ/React ડેવલપર્સ માટે જેઓ React Native તરફ જઈ રહ્યા છે તે **વેબથી મુખ્ય તફાવતો** સમજવું ખાસ અગત્ય છે: View ને div ની જગ્યાએ અને Text ને p/span ની જગ્યાએ વપરવું (બધા-ટેક્સ્ટ-ઇન-Text નિયમ સાથે), CSS ક્લાસ/ફાઇલોની જગ્યાએ style પ્રોપ દ્વારા સ્ટાઇલ કરવું, onClick ની જગ્યાએ touchables/Pressable વપરવું, અને **લાંબી યાદીઓ માટે FlatList** (જે કાર્યક્ષમ રીતે/આળસપૂર્વક રેન્ડર કરે) બધું મેપ કરવાની જગ્યાએ — આ તફાવતો સામાન્ય અંધકાર છે જે મુખ્ય ઘટકોને સમજવું સ્પષ્ટ કરે છે. ઘટકો બનાવે છે (React જેવું) UI બનાવવા માટે, View મૂળભૂત કન્ટેનર તરીકે. મુખ્ય ઘટકો દરેક React Native UI ના બંધારણ બ્લોક્સ હોવાથી (તમે સતત તેમને ઇન્ટરફેસ બનાવવા માટે વપરો છો) અને આ ઘટકોને અને તેઓ વેબ HTML થી કેવી રીતે અલગ છે તે સમજવું React Native યોગ્ય બનાવવા માટે મૌલિક છે (ખાસ કરીને વેબ ડેવલપર્સ માટે), મુખ્ય ઘટકોને સમજવું આવશ્યક, મૌલિક React Native જ્ઞાન છે — React Native UI ની મૂળભૂત શબ્દભંડોર, કોઈપણ ઇન્ટરફેસ બનાવવા માટે જરૂરી અને વેબ React જ્ઞાનને મૂળ ઘટક મોડેલમાં અનુકૂલ કરવા માટે, React Native વિકાસ માટે મુખ્ય ક્ષમતા.