移动端返回后页面没刷新
先理解原理和示例,再练习完整口述与追问。
回答要点
区分路由、缓存和 WebView;显式失效策略。
原理拆解
移动端“返回”至少有几种机制:SPA 路由组件复用、keep-alive 再激活、浏览器历史中的页面恢复,以及原生 App WebView 恢复。它们不是同一个生命周期,可能不重新执行 mounted,也不需要一律重载页面。先确认具体宿主与事件,再把视图状态保留和业务数据失效分开。筛选与滚动可以保留,记录发生修改、缓存过期或账号变化时才重新请求。
示例与推演
用户从订单列表进入详情并修改状态。成功后记录列表失效,返回时按真实环境由 activated、pageshow、visibility 或 App 约定事件触发统一 refreshIfNeeded;同时维护进行中任务和请求版本,避免多个事件到来重复加载。浏览器 pageshow 的 persisted 可帮助识别相应历史缓存恢复,App 自定义恢复则要查实际桥接协议,不能假造事件名。
易错点
created/mounted 不保证每次返回都执行,visibilitychange 也不是所有路由返回必触发。不要在全部钩子无条件重查;刷新认证与数据前确认当前账号,旧请求不得覆盖恢复后的新状态。
参考回答可直接练习口述
我先确认返回走的是 SPA 路由、keep-alive 激活、浏览器历史缓存还是 App WebView 恢复,它们不会都重新 mounted。列表筛选和滚动可保留,业务数据用过期时间或编辑成功后的失效标记刷新;按实际情况监听 activated、pageshow、visibility 或 App 约定事件,并统一去重。不要在每个钩子都请求一次,验证返回后既拿到新数据又不重复加载。