vue3 pinia数据持久化，页面刷新，store的数据也不会消失

1、安装插件

yarn add pinia-plugin-persistedstate

 2、在store/index.js 中使用

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

export const useStore = defineStore('main', {
    state: () => ({
        chartData:{}
    }), 
    persist: true,
    getters: {
        
    },
    actions: {
        
    }
})

const pinia = createPinia();
pinia.use(piniaPluginPersistedstate);
export default pinia;

3、在main.js中引入

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import ElementPlus from 'element-plus'
import zhCn from 'element-plus/es/locale/lang/zh-cn'
import pinia from '@/store'

import config from '@/config/index';

const app = createApp(App)
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
}
app.use(router)
app.use(pinia)
app.use(ElementPlus, {
  locale: zhCn,
})
//设置全局变量
app.config.globalProperties.$baseUrl = process.env.NODE_ENV === 'production' ? ".." : config.baseUrl;
app.config.globalProperties.$sid = sid;
app.mount('#app')