Vite+Vue3+TS+Pinia解决pinia持久化

Vite+Vue3+TS+Pinia解决pinia持久化

每日一坑，记一笔。

安装插件

pnpm i pinia-plugin-persistedstate

使用插件

import {createPinia} from "pinia";
import pinIaPluginPersistedState from "pinia-plugin-persistedstate"

const pinIa = createPinia();
pinIa.use(pinIaPluginPersistedState)
export default pinIa;

设置启用持久化

import { defineStore } from "pinia"

const useLoginStore = defineStore("useLoginStore", {
    state: () => ({
        isLogin: true
    }),
    actions: {
        // 更新登录状态
        updateIsLogin(payload: boolean) {
            this.isLogin = payload
        }
    },
    // 必须更改状态后才会持久化
    persist: {
        storage: sessionStorage
    }
});

export default useLoginStore

解决办法，就是必须更新一下状态才会启动持久化，否则浏览器无法存储。