如何学习 react native 和 Expo
推荐学习顺序：
-
掌握 React Native 核心组件（视图、文本、样式、交互）
-
学会使用
react-navigation跳转页面 -
学习 Expo 常用模块（如图片、通知、存储）
-
尝试项目开发 + 真机测试（Expo Go）
-
理解 build / 打包流程（EAS Build）
🟢 第一部分：React Native 核心 API（重点是“基础开发能力”）
| 类别 | 关键 API | 用途 |
|---|---|---|
| 📦 布局 | View、ScrollView、SafeAreaView | 布局容器、滚动区域、适配 iPhone X 等异形屏 |
| 🖼️ 展示 | Text、Image | 显示文本、图片 |
| 🧭 导航 | react-navigation：Stack.Navigator、Tab.Navigator | 页面跳转、顶部/底部导航 |
| 🧮 样式 | StyleSheet.create | 创建样式对象，类似 CSS |
| 🔠 输入 | TextInput、KeyboardAvoidingView | 表单输入、软键盘适配 |
| ⬆️ 列表 | FlatList、SectionList | 渲染大量数据列表 |
| ⚙️ 状态 | useState、useEffect、useRef、useContext | React 核心 Hooks |
| ✋ 手势 | TouchableOpacity、Pressable | 按钮点击、手势反馈 |
| 🌀 动画 | Animated（或 Reanimated） | 控制组件过渡、动效 |
| 📲 平台 | Platform、Dimensions | 判断平台（iOS/Android）和设备尺寸 |
| 🔒 权限 | PermissionsAndroid（部分 Expo 模块内部已封装） | Android 权限控制 |
🟣 第二部分：Expo 特有能力（核心是“能力扩展”）
| 类别 | 模块 | 用途 |
|---|---|---|
| 📷 媒体 | expo-image-picker | 选取图片或拍照上传 |
| 📍 定位 | expo-location | 获取地理位置信息 |
| 🔔 通知 | expo-notifications | 推送通知功能 |
| 🎬 启动页 | expo-splash-screen | 自定义启动页 |
| 💾 存储 | expo-secure-store、AsyncStorage | 保存用户 token、偏好设置等 |
| 🛠️ 系统功能 | expo-device、expo-clipboard、expo-network | 设备信息、复制粘贴、网络状态等 |
| 📦 路由 | expo-router | 类似 Next.js 的文件夹路由方式 |
| 🧪 更新 | expo-updates | 热更新，用户无需重新下载 app |
| 🎨 图标 | @expo/vector-icons | 内置图标库 FontAwesome 等 |
不建议只看 Expo 文档。
✅ Expo 文档是对 React Native 的封装与扩展，而不是替代。
所以你在用 Expo 时，两份文档都建议查阅：
-
📘 Expo 官方文档（https://docs.expo.dev）：主要讲的是 Expo 特有的内容（如 ImagePicker、AppLoading、Push 通知、expo-router、预构建等）。
-
📘 React Native 官方文档（https://reactnative.dev/docs）：讲的是核心组件和 API，如
View、Text、StyleSheet、FlatList、手势、动画等。
✅ 举例说明：
| 场景 | 应该查阅哪个文档？ |
|---|---|
你想知道如何使用 <Text>、<ScrollView>、StyleSheet.create | 📘 React Native 文档 |
| 你想使用相机、图片选择器、推送通知、全局更新 | 📘 Expo 文档 |
你想了解 expo-router 的页面结构 | 📘 Expo 文档 |
| 你想做手势操作、动画过渡 | 📘 React Native 文档（+ Reanimated） |
✅ 最后一句话总结：
Expo 是 React Native 的上层工具集，它简化开发流程，但不等于完全替代 React Native 文档。