pinia持久化插件

和vuex一样刷新数据丢失

插件名称pinia-plugin-persistedstate

npm i pinia-plugin-persistedstate

main.ts

import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
const app = createApp(App)
const store = createPinia()
store.use(piniaPluginPersistedstate)
//这个一定要
app.use(store)

store

// stores/counter.ts
import { defineStore,createPinia } from 'pinia'
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'

// 创建 Pinia 实例并使用插件
const pinia = createPinia()
pinia.use(piniaPluginPersistedstate)

export const useAuthStore = defineStore('counter', {
  state: () => ({
    count: 0,
    user: null as Record<string, any> | null,
  }),
  actions: {
    increment() {
      this.count++
    },
    setUser(result: Record<string, any>) {
      this.user = result; // 存储整个 Result 对象
    },
  },
  persist: true, // 放在此处配置持久化
})