pinia $reset、$subscribe、$onAction

<template>
  <div @click="[store.count++,store.increment()]">
    直接通过实例.就可以获取
    {{ store.count }}---- {{ store.sex }}
  </div>
  <div @click="reset">恢复</div>

  </template>
  
  <script setup lang='ts'>
  import { useStore } from '../store'
  const store = useStore()
  // $reset是恢复到state定义的初始值
  const reset = () => {
    store.$reset()
  }

  // 监听state数据的变化就会触发，arg是store实例，state是当前的state
  store.$subscribe((arg,state) => {
    console.log(arg,state)
  },{
    detached: true, // 组件销毁时仍然监听
    // 跟watch的一样
    deep: true, // 深度监听s
    immediate: true, // 立即执行
    flush: 'sync' // 同步执行
  })

  // 监听action的触发，arg参数包含store的实例、after、onError、传参
  store.$onAction((arg) => {
    console.log(arg.args) // 调用时候的传参
    arg.after(()=>{ // 执行完action后的回调,watechEfferct的副作用函数相反，这是之后执行的
      console.log('执行完action后的回调')
    })
    arg.onError((err) => { // action执行出错的回调
      console.log(err)
    })
  },true) // 组件销毁时仍然监听
  </script>
  
  <style scoped lang='scss'>
  
  </style>