旧 Ionic 2 项目里,一个 Tab 页面只在首次打开时请求数据,再切回来仍显示原内容。需求却是每次进入都刷新。页面被缓存而不是重新创建,是理解这个差别的关键。

创建一次与进入多次

在 Ionic 2/3 时代的导航体系中,ionViewDidLoad 用于页面创建后的初始化;缓存页面再次进入时,不会重新执行同一次创建流程。ionViewWillEnter 和 ionViewDidEnter 分别对应即将进入与已经进入。Ionic v3 归档生命周期说明

这些名称属于旧导航体系,不能把整个列表直接当作当前所有 Ionic 框架的生命周期。

把刷新放在进入阶段

例如旧页面组件中可保留以下关系:

ionViewDidLoad() {
  // 只需要在页面创建时执行的初始化
}

ionViewDidEnter() {
  this.reloadData();
}

reloadData 是项目自己的数据加载方法,应负责加载状态、成功与错误。不要在 didLoad 和 didEnter 里同时无条件请求同一数据,导致首次进入重复加载。

当时将相关逻辑改到 ionViewDidEnter 后,Tab 的刷新恢复。至于在动画前还是动画后请求,应按交互要求选择,而不是认为其中一个钩子必然更正确。

不同导航层级要分别观察

Tab 切换、当前 NavController 的 push/返回和根导航操作,可能作用于不同页面。先在真正的页面组件记录进入、离开和销毁事件,再核对请求发出了几次,不要只看某个子组件里的日志。

旧项目曾出现 willEnter 与某条根导航路径不符合预期的观察,但缺少完整结构,不能据此认定该钩子普遍不支持根导航。

刷新还要防止过期结果覆盖

快速切换可能产生并发请求。可以按项目采用取消、请求序号或明确的缓存策略,避免较早请求的迟到结果覆盖新数据。离开页面时也要处理订阅、定时器和错误提示。

最终应分别验证首次进入、切出后返回与导航返回。刷新策略应来自业务需求,而不是通过销毁全部缓存绕过生命周期。