Pinia

与 Vuex 的对比

Vuex 4 是为 Vue 3 更新的版本，但保留了 mutation/action 两层写法——同步操作走 mutation，异步操作走 action，这个设计在 Vue DevTools 里便于追踪，但在日常开发中制造了大量样板代码。为什么要区分 mutation 和 action？开发者经常质疑这个设计。

Pinia 直接砍掉了 mutation——只有 state（数据）和 actions（同步或异步都行），还加了 getters（计算属性）。三个概念对应 Vue 组件的 data/methods/computed，几乎没有学习成本。[1]

Composition API 风格

Pinia 支持两种定义 store 的风格：Options Store（类似 Vuex，用 state/actions/getters 对象）和 Setup Store（用 ref/computed/函数，与 Composition API 完全一致）。Setup Store 的写法和写一个普通 composable 几乎一样，学习曲线极低。

• 完整的 TypeScript 支持，无需额外类型声明就能得到完整自动补全
• 开箱即用的 Vue DevTools 集成，支持时间旅行调试
• 体积约 1.5KB（gzip），比 Vuex 4 轻
• 支持插件系统，pinia-plugin-persistedstate 可一行代码实现状态持久化到 localStorage