uni.navigateBack()在H5刷新后失效的根本原因是刷新清空虚拟页面栈，导致getCurrentPages()仅剩当前页，调用时静默失败；需用safeNavigateBack封装，优先走uni.navigateBack，栈空则降级history.go()。
uni.navigateBack()在H5刷新后失效的根本原因
不是代码写错了，而是H5刷新会清空uni-app运行时维护的虚拟页面栈。getCurrentPages()刷新后只剩当前页，uni.navigateBack()找不到上一页，直接静默失败。这和小程序完全不同——小程序原生支持多页栈，而H5底层依赖history，刷新等于重置整个SPA上下文。
用history.back()兜底替代uni.navigateBack()
不能只靠uni-app原生API，必须做运行时判断：
function safeNavigateBack(delta = 1) {
const pages = getCurrentPages()
if (pages.length <= 1) {
// 页面栈已丢失，退回到浏览器历史
history.go(-delta)
} else {
uni.navigateBack({ delta })
}
}- 所有返回按钮、左上角返回逻辑，统一走这个封装函数
- 不要在
onUnload或onHide里存页面栈——H5刷新后这些生命周期不触发，存了也白存 - 注意
history.go()可能跳到外站（比如第三方核身回调页），上线前务必实测跳转路径
Vuex状态刷新后丢失？必须配vuex-persistedstate + uni.setStorageSync
默认Vuex是纯内存态，刷新即清零。持久化不是选配，是H5必做项：
import createPersistedState from 'vuex-persistedstate'
import { createStore } from 'vuex'
<p>export default createStore({
state: { /<em> ... </em>/ },
mutations: { /<em> ... </em>/ },
plugins: [
createPersistedState({
storage: {
getItem: key => uni.getStorageSync(key),
setItem: (key, value) => uni.setStorageSync(key, value),
removeItem: key => uni.removeStorageSync(key)
},
paths: ['user.token', 'cart.items'] // 只持久化关键字段，别全存
})
]
})- 别用
localStorage原生对象——uni-app在某些安卓WebView里不兼容 -
paths务必显式声明，否则Vuex模块嵌套深时容易漏存 - 敏感字段如
token，记得在退出登录时调用uni.removeStorageSync('token')主动清理
URL参数 or 本地存储？选哪个传页面关键数据
刷新后要恢复页面内容，得提前把必要数据“带下去”：
立即学习“前端免费学习笔记（深入）”；
- 简单场景（如ID、类型标识）：用URL参数，
uni.navigateTo({ url: '/pages/detail?id=123' })，onLoad里取options.id——轻量、无副作用 - 复杂状态（如表单填写中、筛选条件、滚动位置）：进页前存
uni.setStorageSync('detail_state', { form, filters })，onLoad立即读取并还原——但得自己管理过期逻辑 - 绝对不要把用户输入中的富文本、大图base64塞进URL，会触发浏览器地址栏长度限制或iOS Safari截断
最麻烦的其实是混合场景：比如从列表页带参数跳详情页，详情页又允许用户编辑再刷新——这时候URL参数+本地存储得配合着用，且要约定好优先级（例如本地存储存在时就忽略URL参数）。
