Pinia 处理多步骤表单的核心是按步骤分层管理、按需持久化和状态联动控制；通过结构化分步状态、离开步骤时主动保存、精准配置持久化字段及响应式 getters 实现高效全局状态缓存。
Pinia 处理多步骤表单的全局状态缓存，核心是**按步骤分层管理 + 按需持久化 + 状态联动控制**。它不自动缓存，但提供了清晰、可组合的机制，让开发者能精准控制哪些数据该存、何时存、怎么用。
分步状态结构化：用 reactive 或 ref 明确划分每一步
避免把所有字段堆进一个扁平对象。推荐按步骤建模，例如：
-
基础信息页：
step1: { name: '', phone: '', email: '' } -
地址页：
step2: { province: '', city: '', detail: '' } -
确认页：
step3: { agreeTerms: false, marketingConsent: true } -
元信息：
currentStep: 1, isSubmitted: false, lastSavedAt: null
这样设计便于组件只订阅自己关心的部分，也方便后续做局部校验或条件跳转。
缓存时机由业务驱动：不是“每输一个字就存”，而是“离开步骤时存”
在 nextStep() 或 prevStep() 的 action 中主动触发保存逻辑，而不是监听 input 实时写入。例如：
- 调用
store.saveStep(1, store.step1)→ 内部执行this.step1 = { ...payload }并更新lastSavedAt - 切换到 step2 前，先校验 step1 是否有效（通过 getter），无效则阻断跳转
- 返回上一步时，直接读取已缓存的
step1，无需重新请求或初始化
页面刷新不丢数据：搭配 pinia-plugin-persistedstate 精准配置
插件默认缓存整个 store，但多步骤表单往往只需保留用户填过的内容，而非临时 UI 状态（如 loading、错误提示）。因此要显式指定：
- 只持久化
step1、step2、step3和currentStep - 排除
submitLoading、validationErrors等瞬态字段 - 可加时间戳或版本号 key，实现“过期自动清空”逻辑（比如 24 小时未完成则重置）
跨步骤联动与条件渲染：靠 getters 实现响应式推导
不用在每个组件里手动判断，而是把规则收口到 store：
canGoToStep2: (state) => !!state.step1.email && isValidEmail(state.step1.email)isStep1Complete: (state) => Object.values(state.step1).every(v => v !== '')-
summary: (state) => ({ ...state.step1, ...state.step2 })→ 供最终确认页使用
这些 getter 是响应式的，任意字段变化都会自动更新按钮可用性、进度条、摘要预览等内容。
