A React Native fő komponensek egy készletét biztosítja — például View, Text, Image, ScrollView, TextInput — amelyek natív felhasználói felület elemekre térnek át. Ezek a React Native felhasználói felületek alapvető építőelemei, amelyeket a webes HTML elemek helyett használunk.
React Native uses its OWN components (mapping to native views), NOT HTML:
VIEW → a container (like a <div>) — the basic layout building block
TEXT → display text (ALL text must be inside a <Text>, unlike web)
IMAGE → display images (local or remote)
TEXTINPUT → text input field (like an <input>)
SCROLLVIEW → a scrollable container
FLATLIST → an efficient scrollable LIST (for long lists — renders lazily)
TOUCHABLEOPACITY / PRESSABLE → handle taps (touchable areas)
BUTTON → a basic button
import { View, Text, Image, TextInput, TouchableOpacity } from 'react-native';
function Profile() {
return (
<View style={styles.container}> {/* container (like a div) */}
<Image source={{ uri: 'https://...' }} style={styles.avatar} />
<Text style={styles.name}>Ann</Text> {/* text MUST be in <Text> */}
<TextInput placeholder="Email" />
<TouchableOpacity onPress={() => {}}>
<Text>Submit</Text>
</TouchableOpacity>
</View>
);
}
✓ Use <View> not <div>, <Text> not <p>/<span>; ALL text must be in <Text>
✓ 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
A fő komponensek megértése alapvető a React Native fejlesztéshez, mivel ezek minden React Native felhasználói felület építőelemei — összeépítsd őket a felhasználói felületek összeállításához, ezért ez nélkülözhetetlen alapvető tudás.
A React Native saját komponenseket biztosít, amelyek natív nézetre térnek át (a web HTML elemek helyett), és a lényeges dolgok megértése — View (a tároló, mint egy div), Text (az összes szöveghez, azzal a fontos szabállyal, hogy az összes szövegnek egy Text komponensen belül kell lennie, a webtől eltérően), Image, TextInput, ScrollView, FlatList (hatékony hosszú listák számára), és touchables/Pressable (a koppintások kezelésére) — szükséges bármely React Native felhasználói felület összeállításához.
A kulcsfontosságú eltérések a webről megértése különösen fontos a web/React fejlesztőknek, akik a React Native-ra válnak át: a View használata a div helyett és a Text a p/span helyett (az összes-szöveg-Text-ben szabály mellett), stílus a style proppon keresztül a CSS osztályok/fájlok helyett, touchables/Pressable használata az interakciókhoz az onClick helyett, és FlatList használata hosszú listák számára (amely hatékonyan/lusták módon renderel) az összes leképezése helyett — ezek a különbségek gyakori buktatók, amelyeket a fő komponensek megértése tisztáz.
A komponensek összeépülnek (mint a React) a felhasználói felületek összeállításához, a View mint az alapvető tároló.
Szent a fő komponensek minden React Native felhasználói felület építőelemei (folyamatosan használod őket a felhasználói felületek összeállításához) és ezen komponensek megértése és hogy hvordan térnek el a web HTML-től alapvető a React Native alkalmazások összeállításához (különösen a web fejlesztőknek), a fő komponensek megértése alapvető, nélkülözhetetlen React Native tudás — a React Native felhasználói felület alapvető szókinccse, szükséges bármely felhasználói felület összeállításához és a web React tudás adaptálásához a natív komponens modellre, a React Native fejlesztés alapkompetenciája.