【Vue】Pinia持久化插件

默认情况下，由于pinia是内存存储，当你刷新页面的时候pinia中的数据会丢失，可以借助于persist插件解决这个问题，persist插件支持将pinia中的数据持久化到sessionStorage和localStorage中。

1、安装persist插件

npm install pinia-persistedstate-plugin

2、pinia中使用persist插件

在main.js中

import { createPinia } from 'pinia'
//导入持久化插件
import {createPersistedState} from'pinia-persistedstate-plugin'
const pinia = createPinia()
const persist = createPersistedState()
//pinia使用持久化插件
pinia.use(persist)
app.use(pinia)

3、在创建定义状态是配置持久化

export const useTokenStore = defineStore('token',()=>{
    //1.定义描述token
    const token = ref('')

    //2.定义修改token的方法
    const setToken = (newToken)=>{
        token.value = newToken
    }

    //3.定义移除token的方法
    const removeToken = ()=>{
        token.value=''
    }
    return {
        token,setToken,removeToken
    }
},
//参数持久化
{
    persist:true
}
)