组件中的 Store 测试

组件中的 Store 测试是 Pinia 学习中的单个核心知识点，下面直接说明用法。

定义

组件中的 Store 测试是 Pinia 使用中的一个独立知识点，核心作用是：使用@vue/test-utils测试使用Store的组件，掌握mock注入Store。

语法

测试语法通常先创建独立 Pinia 实例，再断言 Store 状态或行为。

TypeScript

import { setActivePinia, createPinia } from 'pinia'
import { describe, it, expect, beforeEach } from 'vitest'

beforeEach(() => setActivePinia(createPinia()))

it('updates state', () => {
  const store = useUserStore()
  store.setName('Tom')
  expect(store.name).toBe('Tom')
})

示例

TypeScript

import { setActivePinia, createPinia } from 'pinia'
import { describe, it, expect, beforeEach } from 'vitest'

beforeEach(() => setActivePinia(createPinia()))

it('updates state', () => {
  const store = useUserStore()
  store.setName('Tom')
  expect(store.name).toBe('Tom')
})

注意事项

每个测试用例应创建独立 Pinia 实例，避免状态互相污染。

要点总结

组件中的 Store 测试 只解决当前知识点对应的问题。
优先使用 Pinia 官方 API，避免引入多余封装。
示例代码应保持 Store 简洁、职责清晰。