Core components katika React Native ni zipi?

Question

Accepted Answer

React Native hutoa seti ya **core components** — kama **View**, **Text**, **Image**, **ScrollView**, **TextInput** — zinazomaap kwa native UI elements. Hizi ndizo vipengele vya msingi vya UIs za React Native, zinazotumiwa badala ya web HTML elements. ## Core components (dhidi ya web 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 ``` ## Mfano ```jsx import { View, Text, Image, TextInput, TouchableOpacity } from 'react-native'; function Profile() { return ( {/* container (like a div) */} Ann {/* text MUST be in */} {}}> Submit ); } ``` ## Tofauti muhimu na web ```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 ``` ## Kwa nini ni muhimu Kuelewa core components ni msingi wa maendeleo ya React Native kwa sababu **ndizo vipengele vya kujenga kila UI ya React Native** — unaziunganisha kujenga interfaces, kwa hivyo ni maarifa ya msingi ya lazima kujua. React Native hutoa **components zake** zinazomaap kwa native views (badala ya web HTML elements), na kuelewa zile muhimu — **View** (container, kama div), **Text** (kwa maandishi yote, na kanuni muhimu kwamba maandishi yote lazima yawe ndani ya Text component, tofauti na web), **Image**, **TextInput**, **ScrollView**, **FlatList** (kwa lists ndefu kwa ufanisi), na touchables/**Pressable** (kushughulikia taps) — ni lazima kujenga UI yoyote ya React Native. Kuelewa **tofauti muhimu na web** ni muhimu hasa kwa web/React developers wanaohamia React Native: kutumia View badala ya div na Text badala ya p/span (na kanuni ya all-text-in-Text), styling kupitia style prop badala ya CSS classes/files, kutumia touchables/Pressable kwa interactions badala ya onClick, na kutumia **FlatList kwa lists ndefu** (inayoonyesha kwa ufanisi/lazima) badala ya kumaap juu ya kila kitu — tofauti hizi ni vikwazo vya kawaida ambavyo kuelewa core components hufafanua. Components huunganishwa (kama React) kujenga UIs, na View kama container ya msingi. Kwa kuwa core components ni vipengele vya kujenga kila UI ya React Native (unazitumia mara kwa mara kujenga interfaces) na kuzielewa na jinsi zinavyotofautiana na web HTML ni msingi wa kujenga React Native apps (hasa kwa web developers), kuelewa core components ni maarifa muhimu ya msingi ya React Native — msamiati wa msingi wa React Native UI, ni lazima kujenga interface yoyote na kurekebisha maarifa ya web React kuendana na native component model, uwezo wa msingi wa maendeleo ya React Native.