应编写自研 Pinia 持久化插件：初始化前用 localStorage 读取并覆盖 state，通过 $subscribe 自动写入变更，监听 storage 事件实现多 tab 同步，提供 flush/reload/migrate 等手动控制接口及钩子支持。
要编写一个能自动恢复状态的 Pinia 持久化插件，核心是监听 store 初始化、拦截 state 设置、在初始化前从持久化介质（如 localStorage）读取并合并数据，并在 state 变更后自动写入。Pinia 官方推荐使用 persistedstate 插件生态，但自研插件更可控、更轻量、也更适合定制逻辑。
监听 store 创建并提前注入初始状态
Pinia 的插件函数会在每个 store 实例创建时被调用。利用 store.$id 构造唯一存储 key，在 store.$onAction 之前（即 store 尚未完成初始化）尝试从 localStorage 中读取已有状态，并用它覆盖默认 state。
- 使用
store._persist或自定义元信息（如store.$persist = { key: 'xxx', storage: localStorage }）声明持久化配置 - 在插件中通过
store.$hydrate方法手动触发状态恢复（需在 store setup 后、首次响应式代理建立前介入） - 推荐在插件中使用
store.$state = JSON.parse(stored) || store.$state直接赋值，避免触发不必要的响应式更新
自动同步变更到持久化介质
状态变更后需及时保存，否则页面刷新会丢失最新数据。Pinia 提供 store.$subscribe，它在 state 被 commit 后触发，且可选 { detached: true } 避免依赖组件生命周期。
- 订阅时过滤掉服务端预取或初始化填充等非用户驱动的变更（可通过
mutation.type或自定义标记区分） - 对复杂嵌套对象，建议用
JSON.stringify序列化；若含不可序列化值（如函数、Date、Map），需提前净化或改用structuredClone+ 自定义序列化器 - 写入前做防抖（例如 300ms 延迟写入），避免高频操作频繁触发 localStorage.setItem
支持多 tab 状态同步与冲突处理
localStorage 本身不触发跨 tab 事件，需监听 storage 全局事件来实现“其他标签页修改后本页自动更新”。
- 在插件中为 window 添加
storage事件监听器，比对event.key是否匹配当前 store key - 检测到变化时，用新值深合并（而非全量替换）当前 state，保留本地尚未提交的变更（可选策略：以 local 为准 / 以 storage 为准 / 合并 diff 字段）
- 注意避免循环同步：本页写入 → 触发自身 storage 事件 → 再次写入 → …… 可通过临时标记
isWriting或比对 event.url 排除自身触发
提供手动控制接口与调试支持
生产环境需要可控性，比如登录后清空用户私有缓存、版本升级时迁移旧数据、开发时快速重置。
- 为每个 store 注入方法如
store.$persist.flush()（清空）、store.$persist.reload()（重新拉取）、store.$persist.migrate(fn)（按版本转换数据） - 在插件选项中开放
beforeRestore和afterHydrate钩子，方便做数据校验、字段映射或降级处理 - 开发环境下启用日志（如
console.debug('[pinia-persist]', 'restored', store.$id)），便于追踪恢复时机和内容
