Pinia的api

$dispose

让pinia插件屏蔽该插件的显示,并使得一些api如 $onAction等属性失效

const myPinia = useMyPinia() // 使用pinia
myPinia.$dispose() // 在pinia插件上将不再显示useMyPinia

在这里插入图片描述

$onAction

当pinia调用函数的时候触发该属性,onAction接收一个回调和一个detached属性。

myPinia.$onAction(({
     
     
    store,name,args,after,onError 
}) => {
    
    
    console.log(store) //返回商店,也就调用store的实例对象
    console.log(name)  // 返回执行动作的名称
    console.log(args)  //传递给函数的参数
    after(resolvedValue => {
    
     // 成功回调返回的值,也就是在pinia调用该函数返回的值
        console.log(resolvedValue)
    })
     onError((error) => {
    
     //失败时设置回调
    console.log(error)
 }) 
}) 

onAction将返回一个函数来删除该回调,在组件内部调用 store.$onAction() 时,除非将 detached 设置为 true,否则在卸载组件时将自动清理。

  • 例如
let callback = myPinia.$onAction(({
     
     
    store,name,args,after,onError 
}) => {
    
    
    console.log(store) //返回商店
    console.log(name)  // 返回执行动作的名称
    console.log(args)  //传递给函数的参数
    after(resolvedValue => {
    
     // 成功回调返回的值,也就是在pinia调用该函数返回的值
        console.log(resolvedValue)
    })
     onError((error) => {
    
     //失败时设置回调
    console.log(error)
 })
},true)// true可选,为true可以函数该回调也就是第一个参数
callback() // 该函数执行的时候将不会执行,myPinia.$onAction的回调函数

$patch

可以改变pinia中的state状态。

myPinia.$patch(state => {
    
     //返回值是总state状态
    state.pinia.fruits = 'orange'
})
myPinia.$patch( {
    
     // 覆盖或合并属性
    state.pinia.fruits = 'orange'
})

$reset

回复已经做出改变的状态。

myPinia.$reset() //只能使用在还有state那种写法的商店上

subscript

状态更改时要调用的回调。类似watch

myPinia.$subscribe((mutation, state) => {
    
    
    /*
    mutation 主要包含三个属性:
        events:当前state改变的具体数据,包括改变前的值和改变后的值
        storeId:是当前store的id
        type:用于记录这次数据变化是通过什么途径,主要有三个分别是:
        "direct":通过action变化的
        "patch object": 通过$patch传递对象的方式改变的
        "patch function": 通过$patch传递函数的方式改变的
    */
    console.log(mutation)
    console.log(state) //当前pinia的实例
})

他也接收第二个参数,{ detached?: true} 的时候,在组件内部 时,除非将 detached 设置为 true,否则在卸载组件时将自动清理。,也返回删除回调。同$onAction类似。

猜你喜欢

转载自blog.csdn.net/qq_46433453/article/details/126251213