Berikut ialah panduan lengkap untuk komponen React Native yang sepadan dengan elemen HTML dan komponen UI Android dan iOS asli boleh merapatkan jurang antara pembangunan web dan mudah alih. Jadual komprehensif ini menyediakan perbandingan sebelah menyebelah untuk membantu pembangun beralih dengan lancar merentas platform.
| React Native Component | HTML Element | Android Component | iOS Component |
|---|---|---|---|
| View | ViewGroup | UIView | |
| Text |
or |
TextView | UILabel |
| Image | ImageView | UIImageView | |
| TextInput | EditText | UITextField | |
| ScrollView | ScrollView | UIScrollView | |
| FlatList |
|
RecyclerView | UITableView |
| SectionList |
|
ExpandableListView | UITableView with sections |
| Button | Button | UIButton | |
| TouchableOpacity | Clickable |
TouchableOpacity | UIButton (with opacity) |
| TouchableHighlight | Clickable |
TouchableHighlight | UIButton (with highlight effect) |
| TouchableWithoutFeedback | Clickable |
View with touch events | UIView with touch events |
| ActivityIndicator | CSS Spinner | ProgressBar | UIActivityIndicatorView |
| Modal | Custom modal/dialog | Dialog | Modal UIViewController |
| Picker | Spinner | UIPickerView | |
| Switch | Switch | UISwitch | |
| Slider | SeekBar | UISlider | |
| StatusBar | N/A | StatusBar | UIStatusBar |
| SafeAreaView | N/A | View (with insets) | UIView respecting safe areas |
| KeyboardAvoidingView | N/A | View with keyboard handling | UIView with keyboard handling |
| Pressable | View with touch events | UIView with touch events | |
| RefreshControl | N/A | SwipeRefreshLayout | UIRefreshControl |
| WebView |
