VUE3_持久化

发布时间 2024-01-03 11:37:01作者: 木木的奇奇

1.  安装

npm i pinia-plugin-persistedstate

2.将插件添加到pinia实例上 main.js文件

import { createApp } from 'vue'
import { createPinia } from 'pinia'
// 导入持久化插件
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
import App from './App.vue'
const pinia = createPinia() // 创建Pinia实例
const app = createApp(App) // 创建根实例 app.use(
pinia.use(piniaPluginPersistedstate)) // pinia插件的安装配置
app.mount('#app') // 视图挂载

3.如何开启持久化?创建 Store 时,将 persist 选项设置为 trueimport { defineStore } from 'pinia'


export const useStore = defineStore('store', {
  state: () => {
    save:{
me:'saved',
notMe:'not-saved'
},
saveMeToo:'saved'
}, persist: {
key:'ljq-store',
paths:['save.me','saveMeToo'],
storage: sessionStorage
}
})