JSX trong React Native khác JSX web ra sao?

Cú pháp JSX giống hệt — {} cho expression, className không tồn tại (RN dùng style), nhưng set tag hợp lệ khác hoàn toàn. Web JSX cho phép mọi HTML element vì cuối cùng compile ra DOM. RN JSX chỉ chấp nhận các component được export từ react-native hoặc do bạn viết — không có <div>, <span>, <p>, <button>, <input>, <a>, <ul>/<li>.

Mapping thường dùng:
- <div> → <View>
- <span>/<p>/<h1> → <Text>
- <button> → <Pressable> hoặc <TouchableOpacity>
- <input> → <TextInput>
- <img> → <Image source={{ uri: ... }} />
- <a> → <Pressable onPress={() => Linking.openURL(...)}>

Thuộc tính style cũng nhận object JS thay vì string CSS, và không có pseudo-class (:hover, :focus) — phải tự xử qua state.

The JSX syntax is identical — {} for expressions, but className does not exist (RN uses style), and the valid tag set is completely different. Web JSX accepts any HTML element because it compiles to DOM. RN JSX only accepts components exported from react-native or ones you author — there is no <div>, <span>, <p>, <button>, <input>, <a>, <ul>/<li>.

Common mapping:
- <div> → <View>
- <span>/<p>/<h1> → <Text>
- <button> → <Pressable> or <TouchableOpacity>
- <input> → <TextInput>
- <img> → <Image source={{ uri: ... }} />
- <a> → <Pressable onPress={() => Linking.openURL(...)}>

The style prop takes a JS object instead of a CSS string, and there are no pseudo-classes (:hover, :focus) — handle via state.