Pinia

定义

Pinia是一个面向Vue.js的store库与状态管理框架，主要服务于前端Web应用的开发，采用声明式语法并对外提供自身的状态管理API^[1]。它的作用是让状态可以跨组件、跨页面共享，从而解决只依靠组件自身数据或父子传值难以维护大型应用状态的问题^[2]。在Vue生态中，Pinia被Vue.js团队认可为Vuex的可靠替代方案，目前是该生态的官方状态管理库^[1]。

一个使用Pinia的应用由若干store组成，每个store是一段独立诞生、最终彼此关联的状态单元，代码中通过defineStore()函数定义^[2]。库本身压缩后体积约1KB，采用TypeScript编写，并以MIT许可证开源发布^[1]。

原理

Pinia建立在Vue的响应式系统之上，store中的状态是响应式对象，状态发生变化时依赖它的组件会自动重新渲染^[2]。定义一个store需要调用defineStore()，并传入一个唯一的ID作为名称；该ID同时用于连接Vue开发者工具，以便追踪与调试^[3]。

Pinia把store的构成划分为三个部分：state存放状态数据，getters是基于state派生的计算值，actions是修改状态或执行异步逻辑的函数^[3]。与Vuex不同，Pinia不包含mutations，状态既可以直接在action中修改，也可以通过store实例的$patch方法批量更新；状态订阅和action订阅分别由$subscribe和$onAction方法提供^[3]。store既可以采用类似选项式API的对象形式定义，也可以在setup函数中借助ref与computed定义，后一种写法与组合式API一致^[2]。

发展历程

Pinia起始于2019年11月左右的一次实验，最初目的是探索组合式API下Vue的store应当呈现何种形态^[2]。它由Vue核心团队成员Eduardo San Martin Morote构思，作为对Vuex未来演进方向的一种探索，设计目标包括更简洁的API、更少的结构性样板代码以及更好的TypeScript类型推断支持^[1]。有资料记载，2021年8月底Pinia发布2.0版本，同年11月被指定为Vue的官方状态库^[4]。

2022年2月7日，Pinia正式成为Vue.js生态的官方组成部分^[1]。此后Vue官方文档在状态管理部分以Pinia取代了Vuex的位置^[4]。据其官方文档表述，Pinia对Vue 2的支持已于2025年停止，但使用Pinia并不要求开发者必须采用组合式API。稳定版本方面，有记录显示2025年1月20日发布的版本为2.3.1^[1]。

应用

Pinia用于在Vue应用中集中管理需要被多个组件共享的数据，例如登录后的用户信息、购物车商品列表等，组件通过引入对应的store函数并调用它，即可读取或修改共享状态，无需逐层传递props^[5]。由于按模块化设计，一个应用可以创建多个store，每个store对应一类领域逻辑，打包工具能够据此自动进行代码拆分^[6]。

该库对服务端渲染提供支持，这对需要SSR的应用是一项重要特性；同时它自带Vue开发者工具支持，可以查看状态、追踪actions的时间线并执行时间旅行调试^[3]。库还提供插件系统，用于扩展事务、同步本地存储等功能，以适应默认能力不足的场景。

局限

Pinia的状态需要在定义store时明确指定，使用过程中不支持动态添加新的状态^[7]。开发者工具方面的能力也存在限制，有资料指出时间旅行与状态编辑等功能之所以未能完整提供，与Vue开发者工具未开放相应接口有关^[8]。

在迁移层面，Pinia获得官方认可并不意味着Vuex被弃用，对于已经在生产环境使用Vuex的应用，继续沿用原有方案仍是常见做法，因为从一套库迁移到另一套库工作量较大^[6]。此外，Vue 2的支持已在2025年停止，仍停留在Vue 2的项目需要留意兼容性。

参见

• Vue.js —— Pinia所服务的JavaScript前端框架，Pinia是其官方状态管理库。

• Vuex —— Vue生态中早于Pinia的状态管理库，也是Pinia的前身与参照。

• TypeScript —— Pinia以该语言编写，并在其中提供类型推断支持。

• 组合式API —— Pinia设计时重点结合与支持的Vue编程范式。

• 服务端渲染 —— Pinia支持的应用场景之一。