官方文檔
本文主要介紹 vue3組合式 api 使用持久化插件的寫法。
選項式 寫法官方已給出
- 安裝依賴
pnpm i pinia-plugin-persistedstate
- 插件的使用
import { createPinia } from 'pinia'
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'const pinia = createPinia()
pinia.use(piniaPluginPersistedstate)
- 組合式api的寫法
import {defineStore} from 'pinia'
import {ref} from "vue";export const useUserStore = defineStore('user', () => {const token = ref('')const userInfo = ref({})return {token,userInfo}},{persist: {key: 'my-user', // 修改存儲到localStorage時的key值storage: localStorage // 以哪種類型存儲 localStorage|sessionStoragepaths: ['token'] // 默認全部持久化,這里可以配置想要哪個變量持久化}}
)