3、React Native 时间跟踪应用开发指南

React Native 时间跟踪应用开发指南

1. 引言

在之前的开发中，我们构建了第一个 React Native 应用，了解了 React 应用如何通过组件组织，以及如何使用状态（state）和属性（props）来管理和控制数据。现在，我们将深入 React 的基础知识，逐步构建一个时间跟踪应用。这个应用允许用户添加、删除和修改各种计时器，每个计时器对应一个用户想要计时的不同任务。

2. 应用预览

在开始构建之前，我们可以先预览一下完成后的应用：
- 安卓设备 ：使用 Expo 应用扫描 QR 码来尝试应用。
- iOS 设备 ：导航到示例代码文件夹中的 time - tracking/ 目录，在 iOS 模拟器上预览应用，或者将项目 URL 链接发送到你的设备。

3. 应用组件拆分

我们将应用拆分为多个组件，以下是组件层次结构：
- App ：根容器
- EditableTimer ：根据 editFormOpen 属性显示计时器或计时器编辑表单
- Timer ：显示给定的计时器
- TimerForm ：显示给定计时器的编辑表单
- ToggleableTimerForm ：显示创建新计时器的表单
- TimerForm