安装插件

• 前提已经安装好了pinia，这个在创建项目的时候可以选择

npm i pinia-plugin-persistedstate

配置 main.js

• // ---- 表示要改的代码

import './assets/main.css'

import { createApp } from 'vue'
import { createPinia } from 'pinia'

import piniaPluginPersistedstate from 'pinia-plugin-persistedstate' // ----

import App from './App.vue'
import router from './router'
const pinia = createPinia()  //-----
pinia.use(piniaPluginPersistedstate) // -----

const app = createApp(App)

app.use(pinia)   // -----
app.use(router)
app.mount('#app')

使用

import { ref, computed } from 'vue'
import { defineStore } from 'pinia'

export const useCounterStore = defineStore('counter', () => {
  const count = ref(0)
  const doubleCount = computed(() => count.value * 2)
  function increment() {
    count.value++
  }

  return { count, doubleCount, increment }
},
{
  persist: true    // 这个位置设置属性
})