LESSON 16 / 575 分钟
导航、弹窗与 App 生命周期
页面之间如何移动、应用何时失去活动状态,都应显式建模。
用你的前端经验理解
NavigationStack 类似有历史栈的路由;sheet 类似模态,但它有系统手势和平台适配行为。
01 / 理解问题
为什么需要它
原生导航同时涉及页面层级、临时呈现与应用生命周期。进入文章详情是层级推进,编辑表单可能适合 sheet,危险操作确认则可能是 alert。先确定用户完成动作后应回到哪里,再选择容器;不要把所有页面都做成弹窗,也不要用多个布尔值表达复杂路由。
它是怎样工作的
NavigationStack 的路径可以承载可编码或可比较的业务路由值,从而支持返回与深链接处理。sheet 的显示状态要有明确所有者,关闭时决定草稿如何处理。scenePhase 描述场景的活跃状态,但进入后台不保证你有无限时间完成保存;关键数据应在业务动作发生时及时持久化。
02 / 掌握要点
把关键概念连起来
1
导航
用 NavigationStack 建立导航,NavigationLink 进入详情;较复杂流程用类型化路径描述导航状态。
2
弹窗
sheet 展示独立任务,alert 表达需要立即理解或决定的信息。关闭方式与状态保持一致。
3
生命周期
App → Scene → View。scenePhase 表示活跃、非活跃、后台;.task 适合随视图生命周期启动异步工作。
03 / 案例推演
从通知打开指定文章
- 解析通知携带的文章 ID,而不是直接信任任意页面字符串。查找本地记录,必要时请求服务器。
- 若文章存在,将导航路径更新为相应详情;若已删除或无权限,展示明确结果,不能打开空白页面。
- 如果当前正在编辑未保存草稿,要定义是先提示还是保留草稿后跳转,避免导航意图破坏用户工作。
这里需要你亲自判断
onAppear 可能多次触发;App 进入后台后通常不能无限运行,别把后台当常驻 Node 服务。
04 / 动手验证
做一个小练习
做列表 → 详情 → 编辑 sheet 的流程,关闭编辑时同步状态。
- 实现列表进入详情再返回,并用一个不存在的文章 ID 验证失败行为。
- 说明编辑页关闭时与 App 进入后台时分别应该保存哪些状态。
展开参考思路与验收标准
导航状态和业务数据有不同持久化价值。恢复路径前要验证数据仍存在,不能把上次的页面路径当成永远有效的事实。
05 / 检查理解
应该假设 onAppear 只调用一次吗?
答对理解题后即可标记完成