Pinia 状态管理规范（10）

平台规范第 10 条 · 强制度：🔴 必遵。

来源

@agile-team/wl-skills-kit · standards/10-pinia.md

📝 作者

祥

朱祥·025877

平台室

誉

杨晨誉·409322

共享技术中心

于

仲于·026397

共享技术中心

玉

胥庆玉·026117

共享技术中心

瑞

马佳瑞·409338

共享技术中心

---

何时用 Store

• ✅ 跨页面共享：用户信息、权限、全局配置、主题
• ✅ 需要持久化到 localStorage 的状态
• ✅ 多个不相邻组件共享的会话级状态

何时不用 Store（保留页面级 ref）

• ❌ 当前页的查询参数、列表数据、分页、弹窗状态
• ❌ data.ts 内部的所有状态（默认页面级，不提升到 Store）

强制约束

禁止

在 data.ts 里 import Store。

理由：data.ts 是页面数据契约，应保持职责单一，不依赖全局状态。 跨页面共享数据通过 props / 路由参数 / 组件层包装传入，不直接耦合 Store。

Store 文件结构

src/stores/
└── {domain}/
    └── index.ts        每个领域独立目录，避免单文件膨胀

Store 命名

• useXxxStore 标准命名
• 若项目已统一 s_ 前缀（如 s_userStore），全项目保持一致

// src/stores/user/index.ts
export const useUserStore = defineStore("user", () => {
  const userInfo = ref<User | null>(null);
  function setUser(u: User) {
    userInfo.value = u;
  }
  return { userInfo, setUser };
});

持久化

如需持久化，推荐 pinia-plugin-persistedstate：

defineStore('user', () => { ... }, {
  persist: { storage: localStorage, paths: ['userInfo'] }
})