pinia 数据持久化

下载持久化插件

pnpm i pinia-plugin-persistedstate

npm i pinia-plugin-persistedstate

yarn add pinia-plugin-persistedstate

将插件挂载到pinia

import { createPinia } from 'pinia'
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'

const pinia = createPinia()
pinia.use(piniaPluginPersistedstate)

在要进行持久化的的模块中添加persist

import { defineStore } from 'pinia'

export const useStore = defineStore({
  id: 'store',
  state: () => {
    return {
      someState: 'hello pinia',
    }
  },

  // 添加 persist为true即可
  persist: true,

})

persist也可以是个配置项

import { defineStore } from 'pinia'

export const useStore = defineStore({
  ......

  persist: {
    key:'xxx',  // 键名
    stroage: localStorage/sessionStorage, // 保存位置
    paths: ['xxx'], // 需要持久化的数据
  }
})

具体配置可以参考：Configuration | pinia-plugin-persistedstate