103 lines
6.9 KiB
Markdown
103 lines
6.9 KiB
Markdown
# 部门课 05：校园地点小指南与列表到详情的信息流
|
||
|
||
## 教学目标
|
||
|
||
- 区分上一节的“状态发生变化”和本节的“只读数据在页面之间传递”。
|
||
- 认识模型、实例、数组和当前列表项之间的关系。
|
||
- 共同定义轻量的 `CampusPlace`，理解各属性分别描述地点的哪些信息。
|
||
- 知道 `Identifiable` 帮助列表区分每一项，`Hashable` 让地点值能够参与值驱动导航，但不展开协议和哈希原理。
|
||
- 能阅读 `List(places) { place in ... }`，理解 `places` 是整组数据，`place` 是当前一项。
|
||
- 使用 `NavigationStack`、`NavigationLink(value:)` 和 `navigationDestination(for:)` 完成值驱动导航。
|
||
- 理解详情页通过普通的 `let place` 接收只读数据，不需要 `@State` 或 `@Binding`。
|
||
- 能说明为什么同一个详情 View 在点击不同列表项后会显示不同内容。
|
||
- 继续使用 Preview 辅助观察，并以模拟器 Build/Run 作为最终验证。
|
||
|
||
## 教学内容
|
||
|
||
### 1. 从状态变化到只读信息流
|
||
|
||
- 课堂从只有占位标题、已经 Build/Run 的独立项目开始，全部共同代码放在同一 Swift 文件中。
|
||
- 展示完成版校园地点小指南，将数据流画成：
|
||
|
||
```text
|
||
CampusPlace 模型
|
||
→ 地点数组
|
||
→ List 逐项展示
|
||
→ NavigationLink 送出当前地点值
|
||
→ navigationDestination 接收
|
||
→ CampusPlaceDetailView 读取并展示
|
||
```
|
||
|
||
- 对比部门课 4：`@Binding` 用于子 View 修改父 View 的状态，普通的 `let place` 用于详情 View 只读地接收一个值。
|
||
- 强调本节不修改地点数组，也不要求使用 `@State`；重点是追踪一条地点数据怎样从来源到达详情页。
|
||
|
||
### 2. 共同建立模型和两条数据
|
||
|
||
- 共同定义轻量、不可变的 `CampusPlace`，包含唯一 `id`、地点名称、类别、SF Symbol 名称、简介和一条建议。
|
||
- 只用入门语言说明：模型规定“每个地点有哪些信息”，实例是一个具体地点，数组保存多个同类型地点。
|
||
- 为模型采用 `Identifiable` 和 `Hashable`：前者帮助列表区分每一项，后者让地点值能够参与本节的值驱动导航。
|
||
- 共同建立包含两个地点的只读数组，观察同一个模型怎样产生内容不同、结构一致的实例。
|
||
- 不展开协议、哈希算法、类型系统或 `UUID` 的实现原理。
|
||
|
||
### 3. 从数组生成列表
|
||
|
||
- 使用 `List(places) { place in ... }` 按数组内容生成列表行，不额外引入 `ForEach`。
|
||
- 解释 `places` 表示整组地点，闭包中的 `place` 表示当前正在生成的一项；不系统讲授闭包语法。
|
||
- 列表行直接写在 `List` 中，使用此前学过的 `HStack`、`Text`、`Image` 和基础 Modifier 展示系统图标、地点名称和类别。
|
||
- 修改其中一个地点的内容并重新运行，观察列表怎样从同一份数组读取变化。
|
||
|
||
### 4. 值驱动导航与详情参数
|
||
|
||
- 使用 `NavigationStack` 建立列表页、详情页和系统返回操作组成的页面层级。
|
||
- 使用 `NavigationLink(value: place)`，让每一行在点击后送出当前的 `CampusPlace` 值。
|
||
- 使用 `.navigationDestination(for: CampusPlace.self)` 接收同类型导航值，并创建 `CampusPlaceDetailView(place: place)`。
|
||
- 只将详情页拆成独立 View；详情页使用 `let place: CampusPlace`，读取收到地点的名称、图标、简介和建议。
|
||
- 分别点击两个地点并返回，检查详情内容是否始终对应当前选择。
|
||
- 让学员在参考课堂结构的情况下加入第三个地点并重新 Build/Run。
|
||
- 本课使用完整的 `CampusPlace` 作为轻量、不可变的教学导航值，不将其扩展为正式项目的通用路由架构，也不引入 `NavigationPath`、路径恢复或编程式导航。
|
||
|
||
授课干部可以根据课堂节奏选择以下 AI 互动，不作为共同完成要求：
|
||
|
||
- 让 AI 标出一条地点数据从数组到详情页经过的代码位置，再由学员自行核对。
|
||
- 让 AI 用入门语言解释 `Identifiable` 和 `Hashable` 在本例中的作用。
|
||
- 让 AI 检查新增地点是否缺少必要属性，或建议一处局部文案和样式调整。
|
||
|
||
AI 不应通过整段重写代替课堂中的因果追踪，所有修改仍需重新 Build/Run。
|
||
|
||
本节不讲授数组的新增、删除和编辑、`@State` 化的数据集合、`ForEach` 的独立用法、搜索、筛选、按类别分组、收藏、MapKit、定位、网络、异步图片、持久化、CRUD、`NavigationPath`、深层导航、路由架构、协议原理、哈希算法或完整 Swift 类型系统。
|
||
|
||
授课干部备课时可参考 [Understanding the navigation stack](https://developer.apple.com/documentation/swiftui/understanding-the-navigation-stack) 和 [Displaying data in lists](https://developer.apple.com/documentation/swiftui/displaying-data-in-lists)。
|
||
|
||
## 课后作业
|
||
|
||
### 最低完成标准
|
||
|
||
- 完成并个性化“校园地点小指南”。
|
||
- 保留或修改课堂共同完成的两个地点，并参考课堂结构自行补充第三个地点。
|
||
- 第三个地点可以是真实公共校园空间或虚构地点，不包含个人住址、具体活动轨迹或其他私人信息。
|
||
- 三个地点均显示在列表中；点击不同地点后，同一个 `CampusPlaceDetailView` 显示对应内容，系统返回功能正常。
|
||
- 不为每个地点分别写死一个详情页面。
|
||
- 实际 Build/Run 后，通过个人 Fork 和作业分支提交完整项目源码 PR。
|
||
- 简要说明 `places` 与当前 `place` 的区别，以及“列表项—导航值—详情参数”的传递关系。
|
||
|
||
允许参考课堂代码、步骤资料或 AI，不要求脱离参考独立默写模型。
|
||
|
||
### 建议完成标准
|
||
|
||
- 增加更多地点。
|
||
- 新增一个展示字段。
|
||
- 调整列表或详情样式。
|
||
|
||
本节不要求提交截图或录屏。目录、分支、PR 模板和操作细节在备课时确定；未完成或提交受阻时按[共同安排](../iOS部2026十课初步规划.md)记录当前状态并求助。
|
||
|
||
## 验收方式
|
||
|
||
- 授课干部能够从 PR 中取得完整项目，并在模拟器中成功 Build/Run。
|
||
- 列表至少包含三个地点，其中第三个由学员自行补充；点击至少两个不同地点时，详情与选择一致，系统返回正常。
|
||
- `CampusPlace` 能被列表识别并用于值驱动导航；使用 `NavigationLink(value:)` 和 `navigationDestination(for:)`，不为每项写死独立详情。
|
||
- `CampusPlaceDetailView` 通过普通只读参数接收地点。
|
||
- 结合 PR 简短说明了解数据流理解；说明不完整用于反馈，不因表达不够准确拒绝已达到基础要求的作品。
|
||
- 按共同安排检查目录和隐私，确认后给出简短反馈并合并。
|
||
- 不要求解释协议或哈希底层原理，也不要求额外地图、网络、搜索、收藏或复杂路由，不以视觉精致度和地点数量排名。
|
||
- 部门课 06 开头可选少量作品复习信息流，不转化为逐人技术答辩、评分或淘汰。未完成的 Draft PR 保留并提供帮助。
|