Pinia API 文档中文版(翻译)

简介: Pinia API 文档中文版(翻译)

Pinia API 文档


1. @pinia/testing 模块


1.1 接口

1.1.1 TestingOptions

【属性】
(1)fakeApp
  • Optional
fakeApp: boolean
  • 创建一个空 App 并使用创建的测试 pinia 调用 app.use(pinia)。这允许您在单元测试 store 时使用插件 (plugins),因为插件将等待安装 pinia 以便执行。默认为 flase
  • 定义于 testing/src/testing.ts:45

(2)initialState
  • Optional
initialState: StateTree
  • StateTree见:StateTree
  • 允许定义所有store的部分初始状态。此状态在创建store后应用,允许您仅设置测试中所需的一些属性。
  • 定义于 testing/src/testing.ts:15

(3)plugins
  • Optional
plugins: PiniaPlugin
  • PiniaPlugin见:PiniaPlugin
  • 要在测试插件之前安装的插件。添加将在测试时使用的应用程序中使用的任何插件。
  • 定义于 testing/src/testing.ts:21

(4)stubActions
  • Optional
stubActions: boolean
  • 当设置为 false 时,actions 仅为 spied,它们仍然会被执行。当设置为 true 时,actions 将被 spies 替换,导致它们的代码不被执行。默认为flase
  • 注意:提供时createSpy()它只会使 fn参数 成为 undefined。您仍然不得不在createSpy() 中处理它。
  • 定义于 testing/src/testing.ts:30

(5)stubPatch
  • Optional
stubPatch: boolean
  • 当设置为 true 时,调用$patch()不会改变状态。默认为false
    注意:提供时createSpy()它只会使fn论点undefined。您仍然必须在createSpy().
  • 定义于 testing/src/testing.ts:37
【方法】
(1)createSpy
createSpy ( fn?): (… args: any[]) =>any
  • 用于为 action$patch() 创建 spy 的函数。 应在jest项目中使用jest.fn()进行预设置。
  • 参数
参数名 类型
fn? (… args: any[]) =>any
  • 返回fn
(... `args`): `any`
  • 参数
参数名 类型
...args any[]
  • 返回any
  • 定义于 testing/src/testing.ts:51

1.1.2 TestingPinia

【层次结构】
【属性】
(1)app
app: App<any>

被 Pinia 所使用的 App。

定义于 testing/src/testing.ts:60

(2)state
state: Ref<Record<string, StateTree>>

根状态。

继承于Pinia.state

定义于 pinia/src/rootStore.ts:51

【方法】
(1)install
install(app): void
  • 参数
参数名 类型
app App<any>
(2)use
use(plugin): Pinia
  • 添加store插件来扩展每个store
  • 参数
名称 类型 描述
plugin PiniaPlugin 要添加的 store 插件
  • 返回Pinia
  • 继承于Pinia.use
  • 定义于: pinia/src/rootStore.ts:58

1.2 函数

1.2.1 createTestingPinia

▸ createTestingPinia(options?): TestingPinia

创建一个专为需要 mocking store 的单元测试而设计的 pinia 实例。默认情况下,所有操作都是 mocked 的,因此不会执行。这允许您单独对 store 和 组件 分别进行单元测试。您可以使用 stubActions 选项 更改此设置。如果您使用的是 jest,则将它们替换为jest.fn(),否则,您必须提供自己的createSpy选项。

参数

名字 类型 描述
options TestingOptions 配置测试pinia的选项

2. pinia 模块

2.1 枚举

2.1.1 MutationType

表示 SubscriptionCallback 的可能类型

【枚举成员】
(1)direct
  • direct = "direct"

状态(state)的直接突变(mutation):

  • .
store.name = 'new name'
  • .
store.$state.name = 'new name'
  • .
store.list.push('new item')
  • 定义于:pinia/src/types.ts:50
(2)patchFunction
  • patchFunction = "patch function"

使用$patch和一个函数操作状态(state)。

  • 定义于:pinia/src/types.ts:64
(3)patchObject
  • patchObject = "patch object"

使用$patch和一个对象操作状态(state)。

  • 定义于:pinia/src/types.ts:57

2.2 接口

2.2.1 DefineSetupStoreOptions

DefineSetupStoreOptions<Id, S, G, A>

设置存储(setup stores)中 defineStore() 的 options参数。可以扩展以使用 plugin API 来拓展 store 。参见 DefineStoreOptionsBase

【类型参数】
名称 类型
Id 扩展 string
S 扩展 StateTree
G G
A A
属性
(1)actions
  • Optional
actions: A

提取的动作。由 useStore() 添加。创建 store 时不应由用户添加。可以在插件中使用,以获取使用设置函数定义的 store 中的操作列表。注意这是始终定义的。

  • 定义于:pinia/src/types.ts:696

2.2.2 DefineStoreOptions

DefineStoreOptions<Id, S, G, A>

选项存储(option stores)中 defineStore() 的选项参数。可以扩展以使用 plugin API 来拓展 store 。参见 DefineStoreOptionsBase

【类型参数】
名称 类型
Id 扩展 string
S 扩展 StateTree
G G
A A
【层次结构】
【属性】
(1)actions
actions: A & ThisType<A & UnwrapRef<S> & _StoreWithState<Id, S, G, A> & _StoreWithGetters<G> & PiniaCustomProperties<string, StateTree, _GettersTree<StateTree>, _ActionsTree>>

actions的可选对象。

定义于: pinia/src/types.ts:644

(2)getters
getters: G & ThisType<UnwrapRef<S> & _StoreWithGetters<G> & PiniaCustomProperties<string, StateTree, _GettersTree<StateTree>, _ActionsTree>> & _GettersTree<S>

getter 的可选对象。

定义于: pinia/src/types.ts:637

(3)id
id: Id

唯一的字符串键,用于标识整个应用程序中的 store。

【方法】
(1)hydrate
  • Optional
hydrate(storeState, initialState): void
  • 当在存储定义中使用复杂状态(如仅客户端引用)并从pinia.state复制值还不够时,允许在SSR期间对存储进行嵌套。
  • 例子
    如果在您的state, 您使用任何customRefs、任何computeds 或任何ref在 Server 和 Client 上具有不同值的 s,则需要手动对它们进行水合。例如,存储在本地存储中的自定义 ref:
const useStore = defineStore('main', {
  state: () => ({
    n: useLocalStorage('key', 0)
  }),
  hydrate(storeState, initialState) {
    // @ts-expect-error: https://github.com/microsoft/TypeScript/issues/43826
    storeState.n = useLocalStorage('key', 0)
  }
})
  • 参数
名称 类型 描述
storeState UnwrapRef< S> store中的当前状态(state)
initialState UnwrapRef< S> 初始状态
  • 返回void
  • 定义于: pinia/src/types.ts:677
(2)state
  • Optional
state(): S
  • 创建一个新鲜状态的函数。必须是箭头函数以确保正确输入!
  • 返回S
  • 定义于: pinia/src/types.ts:632

2.2.3 DefineStoreOptionsBase

传递给defineStore()的选项在 选项存储(option stores) 和 设置存储(setup stores) 之间是通用的。如果你想给这两种 store 添加自定义选项,则扩展这个接口。

【类型参数】
Name Type
S 扩展 StateTree
Store Store
【层次结构】
  • DefineStoreOptionsBase
    ↳ DefineStoreOptions
    ↳ DefineSetupStoreOptions

2.2.4 DefineStoreOptionsInPlugin

接口

DefineStoreOptionsInPlugin<Id, S, G, A>
【类型参数】
名称 类型
Id 扩展 string
S 扩展 StateTree
G G
A A
【层次结构】
  • Omit<DefineStoreOptions<Id, S, G, A>, “id” | “actions”>
    ↳ DefineStoreOptionsInPlugin
【属性】
(1)actions
actions: A
(2)getters
  • Optional
getters: G & ThisType<UnwrapRef<S> & _StoreWithGetters<G> & PiniaCustomProperties<string, StateTree, _GettersTree<StateTree>, _ActionsTree>> & _GettersTree<S>

getters 的可选对象。

继承于:Omit.getters
定义于:pinia/src/types.ts:637
【方法】
(1)hydrate
  • Optional
hydrate(storeState, initialState): void

当在存储定义中使用复杂状态(如仅客户端引用)并从 pinia.state 复制值还不够时,允许在 SSR 期间对存储进行合并。

  • 例如:
    如果在你的 state 中,你使用任何 customRefs、任何 computeds 或任何在 服务器 和 客户端 上具有不同值的refs,您需要手动 hydrate 它们。例如,存储在本地存储器中的自定义ref:
const useStore = defineStore('main', {
  state: () => ({
    n: useLocalStorage('key', 0)
  }),
  hydrate(storeState, initialState) {
    // @ts-expect-error: https://github.com/microsoft/TypeScript/issues/43826
    storeState.n = useLocalStorage('key', 0)
  }
})
参数
名称 类型 描述
storeState UnwrapRef<S> 存储(store)中的当前状态(state
initialState UnwrapRef<S> initialState
返回 :void
继承于: Omit.hydrate
定义于:pinia/src/types.ts:677

2.2.5 MapStoresCustomization

接口

允许自定义地图助手的界面。使用以下属性扩展此接口:

  • suffixstring。影响 mapStores() 的后缀,默认为Store.

2.2.6 Pinia

每个应用程序都必须拥有自己的 pinia 才能创建 store

【层次结构】
  • Pinia
    ↳ TestingPinia
【属性】
(1)state
state: Ref<Record<string, StateTree>>

根存储。

定义于:pinia/src/rootStore.ts:51
【方法】
(1)install
install(app): void
参数
名称 类型
app App<any>
【返回】:void
【定义于】:pinia/src/rootStore.ts:46
(2)use
use(plugin): Pinia

添加 store插件 以扩展每个 sore

名称 类型 描述
plugin PiniaPlugin 商店插件添加
【返回】:Pinia
【定义于】:pinia/src/rootStore.ts:58

2.2.7 PiniaCustomProperties

PiniaCustomProperties<Id, S, G, A>

用户通过插件添加属性时要扩展的接口。

【类型参数】
名称 类型
Id 扩展 string=string
S 扩展 StateTree=StateTree
G _GettersTree< S>
A _ActionsTree
【属性】
(1)$nuxt
$nuxt: Context
  • Nuxt 上下文。
  • 定义于:nuxt/src/module.ts:68
(2)double
double: number
  • 定义于:pinia/tests/storePlugins.spec.ts:14
(3)globalA
globalA: string
  • 定义于:pinia/tests/storePlugins.spec.ts:11
(4)globalB
globalB: string
  • 定义于:pinia/tests/storePlugins.spec.ts:12
(5)hasApp
hasApp: boolean
  • 定义于:pinia/tests/storePlugins.spec.ts:9
(6)idFromPlugin
idFromPlugin: Id
  • 定义于:pinia/tests/storePlugins.spec.ts:10
(7)pluginN
pluginN: number
  • 定义于:pinia/tests/storePlugins.spec.ts:7
(8)shared
shared: number
  • 定义于:pinia/tests/storePlugins.spec.ts:13
(9)uid
uid: number
  • 定义于:pinia/tests/storePlugins.spec.ts:8
【存取器】(Accessors)
(1)route
访问(get)
route(): RouteLocationNormalized
  • 返回:RouteLocationNormalized
  • 定义于:playground/src/main.ts:17
存入(set)
route(value): void
  • 参数
名称 类型
value RouteLocationNormalizedLoaded
  • 返回:void
  • 定义于:playground/src/main.ts:14

2.2.8 PiniaCustomStateProperties

PiniaCustomStateProperties<S>

pinia.use() 添加给每个 store.$state 的属性。

类型参数
名称 类型
S 继承于 StateTree = StateTree

2.2.9 PiniaPlugin

可调用
(1)PiniaPlugin
PiniaPlugin(context): void | Partial<PiniaCustomProperties<string, StateTree, _GettersTree<StateTree>, _ActionsTree> & PiniaCustomStateProperties<StateTree>>

扩展每个 store 的插件。返回一个对象以扩展 store 或不返回任何内容。

参数
名称 类型 描述
context PiniaPluginContext< string, StateTree, _GettersTree< StateTree>, _ActionsTree> context

2.2.10 PiniaPluginContext

接口

PiniaPluginContext<Id, S, G, A>

传给 Pinia 插件的上下文参数

类型参数
名称 类型
Id 继承于 string = string
S 继承于 StateTree = StateTree
G _GettersTree<S>
A _ActionsTree
属性
(1)app
app: App<any>

使用 Vue.createApp() 创建的当前应用。

定义于:pinia/src/rootStore.ts:117
(2)options

options:

DefineStoreOptionsInPlugin<`Id`, `S`, `G`, `A`>

当前被拓展的 store。

定义于:pinia/src/rootStore.ts:127
(3)pinia
pinia: Pinia

pinia 实例。

定义于:pinia/src/rootStore.ts:112
(4)store
store: Store<Id, S, G, A>

当前被扩展的 store 。

定义于 :pinia/src/rootStore.ts:122

2.2.11 StoreDefinition

StoreProperties<Id>
类型参数
名称 类型
Id 继承于 string = string
S 继承于 StateTree = StateTree
G _GettersTree<S>
A _ActionsTree
可调用
(1)StoreDefinition
StoreDefinition(pinia?, hot?): Store<`Id`, `S`, `G`, `A`>

返回一个 store,如果必要则创建它。

参数
名称 类型 描述
pinia? null Pinia
hot? StoreGeneric 仅dev热模块更换(HMR)
返回
Store<`Id`, `S`, `G`, `A`>
定义于 pinia/src/types.ts:503
属性
(1)$id
$id: Id

store的 id。被 map helpers 所使用。

定义于 pinia/src/types.ts:508

2.2.12 StoreProperties

StoreProperties<Id>

一个store的属性。

类型参数
名称 类型
Id 继承于string
结构层次
  • StoreProperties
    ↳ _StoreWithState
属性
(1)$id
$id: Id

一个 store 的唯一标识符。

定义于: pinia/src/types.ts:255

2.2.13 SubscriptionCallbackMutationDirect

接口

SubscriptionCallbackMutationDirect
结构层次
  • _SubscriptionCallbackMutationBase
    ↳ SubscriptionCallbackMutationDirect
属性
(1)events

events: DebuggerEvent

仅 DEV 。 不同的 mutation 调用。

定义于:pinia/src/types.ts:96

(2)storeId

storeId: string

正在 mutation 的 存储(store)的 id。

继承自:_SubscriptionCallbackMutationBase.storeId
定义于:pinia/src/types.ts:81

(3)type

type: direct

mutation(突变)的类型。

覆写:_SubscriptionCallbackMutationBase.type
定义于:pinia/src/types.ts:91

2.2.14 SubscriptionCallbackMutationPatchFunction

接口

SubscriptionCallbackMutationPatchFunction

$patch()用函数调用时,存储时传递给一个 subscription 回调的上下文。

属性
(1)events

events: DebuggerEvent[]

仅 DEV 。 回调内部完成的所有突变的数组。

定义于:pinia/src/types.ts:129

(2)storeId

storeId: string

使用 mutation 时的 store 的 id。

继承自:_SubscriptionCallbackMutationBase.storeId
定义于:pinia/src/types.ts:81

(3)type

type: patchFunction

mutation 的类型。

覆写:_SubscriptionCallbackMutationBase.type
定义于:pinia/src/types.ts:124

2.2.15 SubscriptionCallbackMutationPatchObject

接口:

SubscriptionCallbackMutationPatchObject<S>
类型参数
名称
S
结构层次
  • _SubscriptionCallbackMutationBase
    ↳ SubscriptionCallbackMutationPatchObject
属性
(1)events

events: DebuggerEvent[]

仅 DEV。 patch 调用的数组。

定义于:pinia/src/types.ts:110
(2)payload

payload: _DeepPartial<S>

传给 store.$patch() 的对象。

定义于:pinia/src/types.ts:115
(3)storeId

storeId: string

正在 mutation 的 store 的 id。

继承自:_SubscriptionCallbackMutationBase.storeId
定义于:pinia/src/types.ts:81
(4)type

type: patchObject

mutation 的类型。

覆写:_SubscriptionCallbackMutationBase.type
定义于:pinia/src/types.ts:105

2.2.16 _StoreWithState

接口:

_StoreWithState<Id, S, G, A>

带有状态(state)和函数(functions)的基本存储。不应直接使用。

名称 类型
Id 继承于 string
S 继承于 StateTree
G G
A A
结构层次
  • StoreProperties
    ↳ _StoreWithState
属性
(1)$id

store 的唯一标识符。

继承自:StoreProperties
定义于:pinia/src/types.ts:255

(2)$state

$state: UnwrapRef<S> & PiniaCustomStateProperties<S>

Store 的状态(state)。

若设置它将替换掉整个 state。

定义于:pinia/src/types.ts:327
方法
(1)$dispose
$dispose(): void

停止存储的关联效果范围,并将其从存储注册表中删除。插件可以覆盖这个方法来清除任何添加的效果。例如,devtools 插件停止显示来自 devtools 的已处置存储。

返回:void
定义于:pinia/src/types.ts:415

(2)$onAction
$onAction(callback, detached?): () => void

设置一个回调,每次调用一个动作时调用。回调接收一个对象,该对象包含被调用操作的所有相关信息:

  • store: 调用它的存储
  • name: action 的名称
  • args: 传给 action 的参数

除此之外,它还接收两个函数,这两个函数允许在操作(action)完成或失败时设置回调。

它也返回一个移走回调的函数。

注意在组件内部调用 store.$onAction() 时,除非detached分离设置为true,否则当组件被卸载时,它将自动清理。

例子

store.$onAction(({ after, onError }) => {
 // 在这里,您可以在所有钩子之间共享变量,并设置观察器和清理它们
 after((resolvedValue) => {
   // can be used to cleanup side effects
.  // `resolvedValue` is the value returned by the action, if it's a
.  // Promise, it will be the resolved value instead of the Promise
 })
 onError((error) => {
   // 可以用来传递错误
 })
})
参数
名称 类型 描述
callback StoreOnActionListener<Id, S, G, A> 在每个 action 前的回调
detached? boolean detach the subscription from the context this is called from
返回:fn

移去监听器的函数。

(): `void`

设置一个回调,每次调用一个动作(action)时调用。回调接收一个对象,该对象包含被调用操作的所有相关信息:

  • store: 调用它的存储
  • name: 操作(action)的名称
  • args: 传给 action 的参数

除此之外,它还接收两个函数,这两个函数允许在操作完成或失败时设置回调。

它也返回一个函数来移除改回调。

在组件内部调用 store.$onAction() 时请注意,除非 detached 设置为true,否则当组件被卸载时,它将自动清理。

例子

store.$onAction(({ after, onError }) => {
  // 在这里,您可以在所有钩子之间共享变量,并设置观察器和清理它们
  after((resolvedValue) => {
    // 可以用来清除副作用
    // `resolvedValue` 是由 action(操作)返回的值,如果他是一个
    // Promise,它将是 resolved 值,而不是 Promise。
  })
  onError((error) => {
   // 可以用来传递错误
  })
})
返回:void

移去监听器的函数。

定义于:pinia/src/types.ts:405

(3)$patch

$patch(partialState): void

将状态 patch 应用于当前状态。允许传递嵌套值

参数
名称 类型 描述
partialState _DeepPartial<UnwrapRef<S>> patch to apply to the state
返回:void
定义于:pinia/src/types.ts:334
$patch<F>(stateMutator): void

将多个更改分组到一个函数中。当像集合或数组这样的对象发生变化,并且应用对象 patch 不切实际时,例如附加到数组时,这种方法很有用。传递给$patch()的函数必须是同步的

类型参数
名称 类型
F 继承于 (state: UnwrapRef<S>) => any
参数
名称 类型 描述
stateMutator ReturnType<F> extends Promise<any> ? never : F 突变 state的函数,不能是异步的
返回: void
定义于:pinia/src/types.ts:343

(4)$reset
$reset(): void

通过建立一个新的对象,重置store到他的初始状态。

待办事项: 让这仅选项

返回:void
定义于:pinia/src/types.ts:352

(5)$subscribe
$subscribe(`callback`, `options?`): () => `void`

设置一个回调,每当状态改变时调用。

它也返回一个函数来移除改回调。

在组件内部调用 store.$subscribe() 时请注意,它将在组件卸载时自动清理,除非disconnected设置为true

参数
名称 类型 描述
callback SubscriptionCallback<S> callback passed to the watcher
options? { detached?: boolean } & WatchOptions<boolean> watch options + detached to detach the subscription from the context (usually a component) this is called from. Note that the flush option does not affect calls to store.$patch().
返回:fn

移去监听器的函数。

(): `void`

设置一个回调,每当状态改变时调用。

它也返回一个函数来移除改回调。

在组件内部调用 store.$subscribe() 时请注意,它将在组件卸载时自动清理,除非detached设置为true

返回:void

移去监听器的函数。

定义于:pinia/src/types.ts:364

2.2.17 _SubscriptionCallbackMutationBase

接口

_SubscriptionCallbackMutationBase

传递给 subscription 回调的上下文的基类型。内部类型。

结构层次
  • _SubscriptionCallbackMutationBase
    ↳ SubscriptionCallbackMutationDirect
    ↳ SubscriptionCallbackMutationPatchFunction
    ↳ SubscriptionCallbackMutationPatchObject
属性
(1)storeId
storeId: string

正在执行 mutation 的存储的 id

定义于:pinia/src/types.ts:81
(2)type
type: MutationType

mutation 的类型。

定义于:pinia/src/types.ts:76

2.3 类型别名

2.3.1 PiniaStorePlugin

PiniaStorePlugin: PiniaPlugin

用于扩展每个 store 的插件。

弃用 改为使用 PiniaPlugin

定义于:pinia/src/rootStore.ts:149

2.3.2 StateTree

StateTree: Record<string | number | symbol, any>

一个 Store 的泛型状态。

定义于:pinia/src/types.ts:13

2.3.3 Store

Store<Id, S, G, A>: _StoreWithState<Id, S, G, A> & UnwrapRef<S> & _StoreWithGetters<G> & _ActionsTree extends A ? {} : A & PiniaCustomProperties<Id, S, G, A> & PiniaCustomStateProperties<S>

建立一个 store 的 store 的类型

类型参数
名称 类型
Id 继承于 string = string
S 继承于 StateTree = {}
G {}
A {}
定义于:pinia/src/types.ts:462

2.3.4 StoreActions

StoreActions<SS>: SS extends Store<string, StateTree, _GettersTree<StateTree>, infer A> ? A : _ExtractActionsFromSetupStore<SS>

提取存储类型的操作。同时适用于 设置存储(Setup Store)和 选项存储(Options Store)。

类型参数
名称
SS
定义于:pinia/src/store.ts:727

2.3.5 StoreGeneric

StoreGeneric: Store<string, StateTree, _GettersTree<StateTree>, _ActionsTree>

Store 的泛型和类型不安全版本。使用字符串进行访问不会失败,这使得编写不用关心传递的存储类型的泛型函数变得更加容易。

定义于:pinia/src/types.ts:481

2.3.6 StoreGetters

StoreGetters<SS>: SS extends Store<string, StateTree, infer G, _ActionsTree> ? _StoreWithGetters<G> : _ExtractGettersFromSetupStore<SS>

提取存储(store)类型的 访问器(getters)。同时适用于 设置存储(Setup Store) 和 选项存储(Options Store)。

类型参数
名称
SS
定义于:pinia/src/store.ts:740

2.3.7 StoreOnActionListener

StoreOnActionListener<Id, S, G, A>: (context: StoreOnActionListenerContext<Id, S, G, {} extends A ? _ActionsTree : A>) => void
类型参数
名称 类型
Id 继承于 string
S 继承于 StateTree
G G
A A
类型申明

▸ (context): void

store.$onAction() 的参数

参数
Name 类型
context StoreOnActionListenerContext<Id, S, G, {} extends A ? _ActionsTree : A>
返回:void
定义于:pinia/src/types.ts:233

2.3.8 StoreOnActionListenerContext

StoreOnActionListenerContext<Id, S, G, A>: _ActionsTree extends A ? _StoreOnActionListenerContext<StoreGeneric, string, _ActionsTree> : { [Name in keyof A]: Name extends string ? _StoreOnActionListenerContext<Store<Id, S, G, A>, Name, A> : never }[keyof A]

传递给 store.$onAction(context => {}) 回调的上下文对象。

待办事项: 应该只有IdStoreActions 来生成正确的对象。

类型参数
名称 类型
Id extends string
S extends StateTree
G G
A A
定义于:pinia/src/types.ts:217

2.3.9 StoreState

StoreState<SS>: SS extends Store<string, infer S, _GettersTree<StateTree>, _ActionsTree> ? UnwrapRef<S> : _ExtractStateFromSetupStore<SS>

提取一个存储类型的状态,同时适用于 设置存储(Setup Store) 或 选项存储(Options Store) 。

注意,这将打开 refs

类型参数
名称
SS
定义于 pinia/src/store.ts:753

2.3.10 SubscriptionCallback

SubscriptionCallback<S>: (mutation: SubscriptionCallbackMutation<S>, state: UnwrapRef<S>) => void
类型参数
名称
S
类型申明

▸ (mutation, state): void

一个订阅(subscription)的回调。

参数
名称 类型
mutation SubscriptionCallbackMutation<S>
state UnwrapRef<S>
返回:void
定义于:pinia/src/types.ts:148

2.3.11 SubscriptionCallbackMutation

SubscriptionCallbackMutation<S>: SubscriptionCallbackMutationDirect | SubscriptionCallbackMutationPatchObject<S> | SubscriptionCallbackMutationPatchFunction

传给一个 subscription 回调的 Context 对象。

类型参数
名称
S
定义于:pinia/src/types.ts:140

2.4 变量

2.4.1 PiniaVuePlugin

PiniaVuePlugin: Plugin

必须安装Vue 2插件,pinia才能工作.

注意如果你使用的是 Nuxt.js,那么你不需要这个插件,而是使用buildModulehttps://pinia.vuejs.org/ssr/nuxt.html

例子

import Vue from 'vue'
import { PiniaVuePlugin, createPinia } from 'pinia'
Vue.use(PiniaVuePlugin)
const pinia = createPinia()
new Vue({
  el: '#app',
  // ...
  pinia,
})

参数Vue'vue' 中导入。

定义于:pinia/src/vue2-plugin.ts:28

2.5 函数

2.5.1 acceptHMRUpdate

acceptHMRUpdate(initialUseStore, hot): (newModule: any) => any

在 Vite 应用中,创建一个 accept 函数以传入 import.meta.hot

例子

const useUser = defineStore(...)
if (import.meta.hot) {
 import.meta.hot.accept(acceptHMRUpdate(useUser, import.meta.hot))
}
参数
名称 类型 描述
initialUseStore StoreDefinition<string, StateTree, _GettersTree<StateTree>, _ActionsTree> defineStore 返回到热更新
hot any import.meta.hot
返回:fn

▸ (newModule): any

参数
名称 类型
newModule any
返回:any
定义于:pinia/src/hmr.ts:73

2.5.2 createPinia

createPinia(): Pinia

创建一个被应用所使用的 Pinia 实例。

返回:Pinia
定义于:pinia/src/createPinia.ts:10

2.5.3 defineStore

defineStore<Id, S, G, A>(id, options): StoreDefinition<Id, S, G, A>

创建一个检索 store 实例的 useStore 函数。

类型参数
名称 类型
Id 继承于 string
S 继承于 StateTree = {}
G 继承于 _GettersTree<S> = {}
A {}
参数
名称 类型 描述
id Id store 的 id (必须是唯一的)
options Omit<DefineStoreOptions<Id, S, G, A>, "id"> 定义 store 的选项
返回

StoreDefinition<Id, S, G, A>

定义于:pinia/src/store.ts:776
defineStore<Id, S, G, A>(options): StoreDefinition<Id, S, G, A>

创建一个检索 store 实例的 useStore 函数。

类型参数
名称 类型
Id 继承于 string
S 继承于 StateTree = {}
G 继承于 _GettersTree<S> = {}
A {}
参数
名称 类型 描述
options DefineStoreOptions<Id, S, G, A> 定义 store 的选项
返回:StoreDefinition<Id, S, G, A>
定义于:pinia/src/store.ts:792
defineStore<Id, SS>(id, storeSetup, options?): StoreDefinition<Id, _ExtractStateFromSetupStore<SS>, _ExtractGettersFromSetupStore<SS>, _ExtractActionsFromSetupStore<SS>>

创建一个检索 store 实例的 useStore 函数。

类型参数
名称 类型
Id 继承于 string
SS SS
参数
名称 类型 描述
id Id store 的 id (必须是唯一的)
storeSetup () => SS 定义 store 的函数
options? DefineSetupStoreOptions<Id, _ExtractStateFromSetupStore<SS>, _ExtractGettersFromSetupStore<SS>, _ExtractActionsFromSetupStore<SS>> 额外选项
返回
StoreDefinition<Id, _ExtractStateFromSetupStore<SS>, _ExtractGettersFromSetupStore<SS>, _ExtractActionsFromSetupStore<SS>>
定义于:pinia/src/store.ts:807

2.5.4 getActivePinia

Const getActivePinia(): undefined | Pinia

获取当前活动的pinia(如果有)。

返回:undefined | Pinia
定义于:pinia/src/rootStore.ts:39

2.5.5 mapActions

mapActions<Id, S, G, A, KeyMapper>(useStore, keyMapper): _MapActionsObjectReturn<A, KeyMapper>

通过生成要在组件的 methods 字段中铺开的对象,允许直接使用存储(store)中的操作(action),而不使用合成API (setup())。对象的值是操作(action),而键是结果方法的名称。

例子

export default {
  methods: {
    // 其他方法属性
    // useCounterStore 有两个操作(action),分别叫做 `increment` 和 `setCount`
    ...mapActions(useCounterStore, { moar: 'increment', setIt: 'setCount' })
  },
  created() {
    this.moar()
    this.setIt(2)
  }
}
类型参数
名称 类型
Id 继承于 string
S 继承于 StateTree
G 继承于 _GettersTree<S>
A A
KeyMapper 继承于 Record<string, keyof A>
参数
名称 类型 描述
useStore StoreDefinition<Id, S, G, A> 要映射的存储
keyMapper KeyMapper actions 定义新名称的对象
返回:_MapActionsObjectReturn<A, KeyMapper>
定义于:pinia/src/mapHelpers.ts:326
mapActions<Id, S, G, A>(useStore, keys): _MapActionsReturn<A>

通过生成要在组件的 methods 字段中传播的对象,以允许直接使用 store(存储) 中的操作,而不使用组合式API (setup())。

例子

export default {
  methods: {
  // 其他方法属性
  ...mapActions(useCounterStore, ['increment', 'setCount'])
  },
  created() {
    this.increment()
    this.setCount(2) // 照常传递参数
  }
}
类型参数
名称 类型
Id 继承于 string
S 继承于 StateTree
G 继承于 _GettersTree<S>
A A
参数
名称 类型 描述
useStore StoreDefinition<Id, S, G, A> 要映射的存储
keys keyof A[] 要映射的操作(action)名称数组
返回

_MapActionsReturn<A>

定义于:pinia/src/mapHelpers.ts:359

2.5.6 mapGetters

Const

mapGetters<Id, S, G, A, KeyMapper>(useStore, keyMapper): _MapStateObjectReturn<Id, S, G, A, KeyMapper>

mapState()的别名。 你应该改而使用 mapState()

弃用 改用 mapState()

类型参数
名称 类型
Id 继承于 string
S 继承于 StateTree
G 继承于 _GettersTree<S>
A A
KeyMapper 继承于 Record<string, keyof S
参数
名称 类型
useStore StoreDefinition<Id, S, G, A>
keyMapper KeyMapper
返回:_MapStateObjectReturn<Id, S, G, A, KeyMapper>
定义于:pinia/src/mapHelpers.ts:285

Const

mapGetters<Id, S, G, A, Keys>(useStore, keys): _MapStateReturn<S, G, Keys>

mapState()的别名。你应该改而使用 mapState()

弃用: 应该改为使用 mapState()

类型参数
名称 类型
Id 继承于 string
S 继承于 StateTree
G 继承于 _GettersTree<S>
A A
Keys 继承于 string
参数
名称 类型
useStore StoreDefinition<Id, S, G, A>
keys readonly Keys[]
返回:_MapStateReturn<S, G, Keys>
定义于:pinia/src/mapHelpers.ts:285

2.5.7 mapState

mapState<Id, S, G, A, KeyMapper>(useStore, keyMapper): _MapStateObjectReturn<Id, S, G, A, KeyMapper>

通过生成要在组件的 computed 字段中展开的对象,以允许从一个没有使用组合式 API (setup()) 的 store 使用 stategetters

对象的值是状态 properties/getters ,而键是结果计算属性的名称。您也可以传递一个自定义函数,该函数将接收 store 作为其第一个参数。请注意,虽然它可以通过这个访问组件实例,但它不会识别类型。

例子

export default {
  computed: {
    // 其它计算属性
    // useCounterStore 有一个 state 属性叫做 `count` 和一个 getter 叫做 `double`
    ...mapState(useCounterStore, {
      n: 'count',
      triple: store => store.n * 3,
      // 注意如果我们想使用 `this` 则不能使用箭头函数
      custom(store) {
        return this.someComponentValue + store.n
      },
      doubleN: 'double'
    })
  },
  created() {
    this.n // 2
    this.doubleN // 4
  }
}
类型参数
名称 类型
Id 继承于 string
S 继承于 StateTree
G 继承于 _GettersTree<S>
A A
KeyMapper 继承于 Record<string, keyof S
参数
名称 类型 描述
useStore StoreDefinition<Id, S, G, A> 要映射的存储
keyMapper KeyMapper 状态(state)属性或访问器(getter)的对象
返回:_MapStateObjectReturn<Id, S, G, A, KeyMapper>
定义于:pinia/src/mapHelpers.ts:194
mapState<Id, S, G, A, Keys>(useStore, keys): _MapStateReturn<S, G, Keys>

通过生成要在组件的 computed 字段中展开的对象,允许在不使用组合式API (setup()) 的情况下使用一个存储(store)中的状态(state)和访问器(getter)。

例子

export default {
  computed: {
  // 其它计算属性
  ...mapState(useCounterStore, ['count', 'double'])
  },
  created() {
    this.count // 2
    this.double // 4
  }
}
类型参数
名称 类型
Id 继承于 string
S 继承于 StateTree
G 继承于 _GettersTree<S>
A A
Keys 继承于 string
参数
名称 类型 描述
useStore StoreDefinition<Id, S, G, A> 要映射的存储
keys readonly Keys[] 状态(state )属性(properties)或访问器(getters)的数组
返回:_MapStateReturn<S, G, Keys>
定义于:pinia/src/mapHelpers.ts:231

2.5.8 mapStores

mapStores<Stores>(…stores): _Spread<Stores>

通过生成要在组件的 computed 字段中展开的对象,允许使用没有组合式API (setup())的存储。它接受 store 定义的列表。

例子

export default {
 computed: {
   // 其它计算属性
   ...mapStores(useUserStore, useCartStore)
 },
 created() {
   this.userStore // id为"user"的存储
   this.cartStore // id为"cart"的存储
 }
}
类型参数
名称 类型
Stores 继承于 any[]
参数
Name Type 描述
...stores […Stores[]] 要映射到对象的存储(store)列表
返回

_Spread<Stores>

定义于:pinia/src/mapHelpers.ts:96

2.5.9 mapWritableState

mapWritableState<Id, S, G, A, KeyMapper>(useStore, keyMapper): _MapWritableStateObjectReturn<S, KeyMapper>

mapState() 相同,但也创建了computed setters,因此可以修改状态。与 mapState() 不同的是,只能添加状态属性。

类型参数
名称 类型
Id 继承于 string
S 继承于 StateTree
G 继承于 _GettersTree<S>
A A
KeyMapper 继承于 Record<string, keyof S>
参数
名称 类型 描述
useStore StoreDefinition<Id, S, G, A> 要映射的存储
keyMapper KeyMapper 状态属性对象
返回:_MapWritableStateObjectReturn<S, KeyMapper>
定义于:pinia/src/mapHelpers.ts:440
mapWritableState<Id, S, G, A>(useStore, keys): _MapWritableStateReturn<S>

通过生成一个要在组件的 computed字段 中展开的对象,以在不使用组合式API(setup())时,允许从一个 存储(store)使用 状态(state)和 访问器(getter)。

类型参数
名称 类型
Id 继承于 string
S 继承于 StateTree
G 继承于 _GettersTree<S>
A A
参数
名称 类型 描述
useStore StoreDefinition<Id, S, G, A> 要映射的存储
keys keyof S[] 状态(state )属性的数组
返回:_MapWritableStateReturn<S>
定义于:pinia/src/mapHelpers.ts:458

2.5.10 setActivePinia

Const setActivePinia(pinia): undefined | Pinia

设置或取消设置 活动 pinia。在SSR中使用,在内部调用 操作(actions)和 访问器(getters) 时使用。

参数
名称 类型 描述
pinia undefined Pinia
返回

undefined | Pinia

定义于:pinia/src/rootStore.ts:33

2.5.11 setMapStoreSuffix

setMapStoreSuffix(suffix): void

改变由 mapStores() 添加的后缀。可以设置为空字符串。默认为 "Store" 。如果您需要使用TypeScript,请确保扩展 MapStoresCustomization 接口。

参数
Name Type 描述
suffix string 新后缀
返回:void
定义于:pinia/src/mapHelpers.ts:66

2.5.12 skipHydrate

skipHydrate<T>(obj): T
类型参数
名称 类型
T any
参数
名称 类型
obj T
返回:T
定义于:pinia/src/store.ts:85

2.5.13 storeToRefs

storeToRefs<SS>(store): ToRefs<StoreState<SS> & StoreGetters<SS> & PiniaCustomStateProperties<StoreState<SS>>>

用 store 的所有stategetters和 插件添加的(plugin-added)state、 属性(properties)创建一个引用对象。类似于toRefs(),但专门为 Pinia store 设计,因此 方法(methods) 和 非响应性属性(non reactive properties) 被完全忽略。

类型参数
名称 类型
SS 继承于 _StoreWithState<string, StateTree, _GettersTree<StateTree>, _ActionsTree, SS> & {} & _StoreWithGetters<_GettersTree<StateTree>> & PiniaCustomProperties<string, StateTree, _GettersTree<StateTree>, _ActionsTree, SS> & PiniaCustomStateProperties<StateTree, SS>
参数
名称 类型 描述
store SS 用以提取refs的 store
返回

ToRefs<StoreState<SS> & StoreGetters<SS> & PiniaCustomStateProperties<StoreState<SS>>>

定义于:pinia/src/storeToRefs.ts:13

目录
相关文章
|
7月前
|
敏捷开发 测试技术 API
云效产品使用常见问题之代码仓库不支持API文档如何解决
云效作为一款全面覆盖研发全生命周期管理的云端效能平台,致力于帮助企业实现高效协同、敏捷研发和持续交付。本合集收集整理了用户在使用云效过程中遇到的常见问题,问题涉及项目创建与管理、需求规划与迭代、代码托管与版本控制、自动化测试、持续集成与发布等方面。
|
7月前
|
数据可视化 Linux API
如何在Linux使用docker部署Swagger Editor并实现无公网IP远程协同编辑API文档
如何在Linux使用docker部署Swagger Editor并实现无公网IP远程协同编辑API文档
|
2月前
|
API
阿里云短信服务文档与实际API不符
阿里云短信服务文档与实际API不符
|
5月前
|
Java API 开发者
在Spring Boot中集成Swagger API文档
在Spring Boot中集成Swagger API文档
|
1月前
|
JSON 前端开发 API
后端开发中的API设计与文档编写指南####
本文探讨了后端开发中API设计的重要性,并详细阐述了如何编写高效、可维护的API接口。通过实际案例分析,文章强调了清晰的API设计对于前后端分离项目的关键作用,以及良好的文档习惯如何促进团队协作和提升开发效率。 ####
|
4月前
|
Java API 数据中心
百炼平台Java 集成API上传文档到数据中心并添加索引
本文主要演示阿里云百炼产品,如何通过API实现数据中心文档的上传和索引的添加。
141 3
|
5月前
|
安全 Java API
Nest.js 实战 (三):使用 Swagger 优雅地生成 API 文档
这篇文章介绍了Swagger,它是一组开源工具,围绕OpenAPI规范帮助设计、构建、记录和使用RESTAPI。文章主要讨论了Swagger的主要工具,包括SwaggerEditor、SwaggerUI、SwaggerCodegen等。然后介绍了如何在Nest框架中集成Swagger,展示了安装依赖、定义DTO和控制器等步骤,以及如何使用Swagger装饰器。文章最后总结说,集成Swagger文档可以自动生成和维护API文档,规范API标准化和一致性,但会增加开发者工作量,需要保持注释和装饰器的准确性。
151 0
Nest.js 实战 (三):使用 Swagger 优雅地生成 API 文档
|
5月前
|
开发框架 Java 测试技术
Spring Boot中的API文档生成
Spring Boot中的API文档生成
|
5月前
|
JSON Java API
Spring Boot中使用OpenAPI生成API文档
Spring Boot中使用OpenAPI生成API文档
|
6月前
|
自然语言处理 安全 API
触发邮件接口有哪些?邮件API文档
**触发邮件接口**如AokSend、Mailgun、Amazon SES、Postmark和Sendinblue是自动化企业通信的关键。这些接口在特定事件时自动发送邮件,提高效率和客户体验。例如,AokSend提供详细的API文档,支持事件触发、模板管理和多语言集成;Mailgun以灵活性著称;Amazon SES适合大规模发送;Postmark专注于事务邮件;Sendinblue则提供邮件、短信和营销自动化功能。每种服务都有示例代码展示如何使用API发送邮件。选择合适的接口能提升企业通信效率和客户满意度。