pinia刷新页面数据消失（做数据持久化）

只需要下载插件

yarn add pinia-plugin-persistedstate
or
npm i  pinia-plugin-persistedstate

使用插件

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

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


或者是这样的

import { store } from 'quasar/wrappers';
import { createPinia } from 'pinia';
import { Router } from 'vue-router';
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate';

/*
 * When adding new properties to stores, you should also
 * extend the `PiniaCustomProperties` interface.
 * @see https://pinia.vuejs.org/core-concepts/plugins.html#typing-new-store-properties
 */
declare module 'pinia' {
  export interface PiniaCustomProperties {
    readonly router: Router;
  }
}

/*
 * If not building with SSR mode, you can
 * directly export the Store instantiation;
 *
 * The function below can be async too; either use
 * async/await or return a Promise which resolves
 * with the Store instance.
 */

export default store((/* { ssrContext } */) => {
  const pinia = createPinia();
  pinia.use(piniaPluginPersistedstate);
  // You can add Pinia plugins here
  // pinia.use(SomePiniaPlugin)

  return pinia;
});

开启数据持久化只需要增加一行代码

const useHomeStore = defineStore("home",{
  // 开启数据持久化
  persist: true,
  state:()=>{
    info:{}
  }
});