pinia持久化

1安装依赖

pnpm i pinia pinia-plugin-persistedstate @nuxt/devalue -S

2创建store文件夹，创建持久化插件/store/plugins.ts

import { App } from 'vue'
import { createPinia } from 'pinia'
import devalue from '@nuxt/devalue'
import { createPersistedState } from 'pinia-plugin-persistedstate'

export const pinia = createPinia()

export const painaInstall = (app: App) => {
  pinia.use(
    createPersistedState({
      storage: {
        getItem(key: string): string | null {
          return uni.getStorageSync(key)
        },
        setItem(key: string, value: string) {
          uni.setStorageSync(key, value)
        },
      },
    }),
  )
  app.use(pinia)

  devalue(pinia.state.value)
}

3 mian.ts中使用插件

import { createSSRApp } from 'vue'
import App from './App.vue'
import { painaInstall } from '@/store/plugins'

export function createApp() {
  const app = createSSRApp(App)
  app.use(painaInstall)
  return {
    app,
  }
}

4使用

import { User } from "../api/user/user.model";
import { defineStore, acceptHMRUpdate } from "pinia";
import { ref } from "vue";
import { loginApi } from "@/api/user/user";
import { LoginParams, ID, UpdateUserParams } from "@/api/user/user.model";
import { getUserApi, updateUserApi, getUserinfoApi } from "@/api/user/user";
export const useUserStore = defineStore("user", () => {});

if (import.meta.hot) {
  import.meta.hot.accept(acceptHMRUpdate(useUserStore, import.meta.hot));
}