只需要下载插件
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:{}
}
});