简单实现一下pinia持久化插件pinia-plugin-presistedstate

pinia-plugin-persistedstate是一个用于Vue 3的Pinia状态管理库的插件，它可以将状态持久化到本地存储中，以便在刷新页面或重新加载应用程序时保留状态。下面是简单实现pinia-plugin-persistedstate的步骤：

1. 安装依赖：在终端中运行以下命令安装pinia-plugin-persistedstate依赖：

cnpm i pinia-plugin-persistedstate -S

2. 在main.ts中引入pinia并使用插件：在main.ts文件中引入pinia并使用pinia-plugin-persistedstate插件，代码如下：

import { createApp } from 'vue'
import App from './App.vue'
import { createPinia } from 'pinia'
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'

const app = createApp(App)
const pinia = createPinia()
pinia.use(piniaPluginPersistedstate)

app.use(pinia)
app.mount('#app')

3. 在stores/index.ts中定义store并启用持久化：在stores/index.ts文件中定义store并启用持久化，代码如下：

import { defineStore } from 'pinia'

export const useCounterStore = defineStore('counter', {
  state: () => ({
    count: 0
  }),
  actions: {
    increment() {
      this.count++
    }
  }
}, {
  persist: true
})

这样就完成了pinia-plugin-persistedstate的简单实现。