pinia 不自动管理缓存过期,需手动控制:初始化时用 beforerestore 校验时间戳、登出时调用 $clearstorage 清理、按 version 字段淘汰旧结构、启动时异步巡检低频缓存。

Pinia 本身不管理本地缓存的生命周期,清理过期数据得靠你主动控制。插件 pinia-plugin-persistedstate 不会自动判断“数据是否过期”,它只负责同步 state 和 localStorage/sessionStorage。所以“过期”是业务概念——比如 token 有效期 2 小时、用户偏好设置保留 7 天、临时表单草稿 24 小时失效。你需要结合时间戳、版本号或业务逻辑,在合适时机手动清理。
在 store 初始化时检查并清除过期数据
利用插件提供的 beforeRestore 钩子,在状态从本地读取前做校验。适合基于时间过期的场景:
- 给 state 加一个
__savedAt字段,每次写入时记录当前时间戳 - 在
beforeRestore中读出旧数据,比对时间差,超时就返回初始 state(相当于跳过还原) - 示例配置:
beforeRestore: ({ store }) => {
const saved = JSON.parse(localStorage.getItem('pinia/user') || '{}');
if (saved.__savedAt && Date.now() - saved.__savedAt > 7 * 24 * 60 * 60 * 1000) {
return store.$reset(); // 或返回 {} 跳过恢复
}
},
paths: ['token', 'userInfo', '__savedAt']
}
登录/登出时统一清理敏感缓存
用户切换账号、退出登录、或 token 失效时,是最自然的清理时机。不要只清 token,还要清关联数据:
- 调用
store.$clearStorage()(插件暴露的方法),清除该 store 对应的 localStorage 条目 - 如果用了多个 store(如 user、cart、settings),逐个调用或封装批量清理函数
- 注意:登出后立即重置 store 状态 + 清 storage,避免下次进页面时加载旧缓存
按版本号淘汰旧结构缓存
当 store 字段调整(比如把 userName 改成 profile.name),旧缓存解析失败可能报错或显示异常。用 version 字段让插件自动跳过:
- 在 persist 配置中加
version: 2 - 插件会把 version 写入本地存储,下次启动时比对;不一致就忽略还原,等同于“过期清除”
- 配合
afterRestore可做迁移:比如旧数据有username,新结构需要profile.name,就在钩子里转换
定时任务或启动时轻量巡检(可选)
对非关键但需定期刷新的数据(如首页 banner 缓存、天气预报快照),可在应用启动后异步检查:
- 读取对应 key 的 localStorage 数据,解析后检查
expiresAt字段 - 若已过期,调用
localStorage.removeItem(key)手动删掉 - 不建议高频轮询,仅用于低频、弱一致性要求的缓存










