pinia 插件是向所有 store 注入通用方法的标准方式,通过接收 pinia 实例并在 store 初始化时添加响应式属性或方法(如 reset)、拦截 action(via $onaction),且需避免箭头函数以确保 this 指向正确。

在 Pinia 中,插件是给所有 Store 添加通用方法最标准、最推荐的方式。它能避免重复代码,统一逻辑,并且不影响 Store 的定义结构。
插件的基本写法
Pinia 插件是一个函数,接收 pinia 实例作为参数,你可以通过它访问所有 Store 的创建过程,在 Store 初始化时注入方法或属性:
- 插件函数必须返回一个对象(可选),用于向每个 Store 注入响应式属性或方法
- 使用 store.$onAction 可统一拦截 action 执行(如日志、错误处理)
- 直接在 store 上添加属性或方法即可,它们会出现在每个 Store 实例上
添加通用方法的典型示例
比如你想给每个 Store 都加上 reset() 方法,一键重置状态:
export function createResetPlugin() {
return ({ store }) => {
// 给每个 store 添加 reset 方法
store.reset = function () {
const initialState = { ...store.$state }
// 注意:不能直接赋值 store.$state = initialState(非响应式)
// 应该逐个赋值,或用 $patch
store.$patch({ ...initialState })
}
}
}
// 在创建 pinia 时使用
const pinia = createPinia()
pinia.use(createResetPlugin())
注意响应式与 this 指向
在插件中添加的方法里,this 默认指向当前 Store 实例,但需确保方法内正确访问 this.$state 或 this.$patch:
- 避免使用箭头函数定义方法(会丢失 this 绑定)
- 如果需要访问 store 的其他属性(如 actions),建议用 store.xxx 显式调用
- 对复杂重置逻辑,可配合 defineStore 的 state: () => ({}) 形式,方便复用初始状态
扩展:注入工具方法或全局能力
你还可以注入更通用的能力,比如:
- store.toast(msg):调用全局通知组件
- store.request(...):封装统一请求逻辑(含 loading、错误拦截)
- store.logAction(name):记录 action 名称用于调试
只要这些方法不依赖特定 Store 的私有状态,就可以安全地通过插件注入,保持跨 Store 复用性。











