# expo-学习

**Repository Path**: chenbool/expo-learning

## Basic Information

- **Project Name**: expo-学习
- **Description**: expo-学习 案例
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-09-06
- **Last Updated**: 2026-09-13

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# React Native 学习项目

## 项目介绍

这是一个 React Native 学习项目，包含了多个示例文件，用于演示 React Native 开发中的各种核心概念和技术，包括状态管理、网络请求、组件通信、环境变量使用等。

## 项目结构

```
.
├── App.js                     # 主应用文件，展示李白唐诗列表
├── index.js                   # 应用入口文件
├── app.json                   # Expo 应用配置文件
├── package.json               # 项目依赖配置文件
├── .env                       # 环境变量配置文件
├── .gitignore                 # Git 忽略文件配置
├── README.md                  # 项目说明文档
├── README.en.md               # 英文版项目说明文档
├── assets/                    # 静态资源文件夹
│   ├── icon.png              # 应用图标
│   ├── splash-icon.png       # 启动页图标
│   ├── adaptive-icon.png     # Android 自适应图标
│   └── favicon.png           # Web favicon 图标
├── components/               # 组件文件夹
│   └── common/              # 通用组件
│       ├── loadding.js      # 加载指示器组件
│       └── NetworkError.js  # 网络错误组件
├── android/                 # Android 原生代码
│   ├── app/src/main/java/com/anonymous/blank/
│   │   ├── MainActivity.kt  # Android 主活动
│   │   └── MainApplication.kt # Android 主应用
│   └── ...                  # 其他 Android 配置文件
└── 多个 App-*.js 文件        # 各种功能示例文件
```

## 技术栈

- React Native
- Expo
- JavaScript/ES6+

## 功能示例

### 1. 基础状态管理 (App - useState.js)
演示如何使用 React 的 useState Hook 管理组件状态。

### 2. 网络请求 (App - 网络请求.js)
演示如何使用 fetch API 进行网络请求获取数据。

### 3. 生命周期和自动加载 (App - useEffect 启动加载.js)
演示如何使用 useEffect Hook 在组件挂载时自动加载数据。

### 4. 下拉刷新和滚动 (App - 滚动界面.js)
演示如何实现 ScrollView 的滚动功能和下拉刷新。

### 5. 加载状态处理 (App - loadding.js)
演示如何在网络请求时显示加载指示器。

### 6. 组件通信和错误处理 (App - 父子传参.js)
演示父子组件之间的通信以及网络错误处理。

### 7. 环境变量使用 (App - env.js)
演示如何使用环境变量管理不同环境的 API 地址。

## 环境变量配置

项目使用 `.env` 文件管理环境变量：

```
EXPO_PUBLIC_API_URL=https://m1.apifoxmock.com/m2/
```

## 安装和运行

1. 克隆项目到本地：
   ```
   git clone <项目地址>
   ```

2. 安装依赖：
   ```
   npm install
   ```

3. 启动项目：
   ```
   npm start
   ```

4. 在 Expo Go 应用中扫描二维码，或选择在模拟器中运行。

## 项目特点

- 包含多个独立的示例文件，每个文件演示一个特定功能
- 代码注释详细，便于学习和理解
- 涵盖 React Native 开发中的核心概念
- 使用 Expo 简化开发流程
- 包含常见的 UI 组件和交互模式

## 开发资源

- [React Native 官方文档](https://reactnative.dev/)
- [Expo 官方文档](https://docs.expo.dev/)
- [React 官方文档](https://reactjs.org/)