Pinia 永久化存储：使用 localStorage 实现状态数据持久化

Pinia 是一个 Vue 3 的状态管理库，而永久化存储则可以通过使用浏览器提供的本地存储方式来实现。

以下是一个使用 'localStorage' 来实现 Pinia 永久化存储的示例：

import { createPinia } from 'pinia'

const pinia = createPinia()

// 定义一个 localStorage 插件
function localStoragePlugin(store) {
  // 在初始化时从 localStorage 中读取数据
  const persistedState = localStorage.getItem('pinia-state')
  if (persistedState) {
    store.$restore(JSON.parse(persistedState))
  }

  // 订阅 store 的变化，每次变化时将数据存储到 localStorage 中
  store.$subscribe((mutation, state) => {
    localStorage.setItem('pinia-state', JSON.stringify(state))
  })
}

// 注册插件
pinia.use(localStoragePlugin)

export default pinia

这样，每次修改 Pinia 的状态时，都会将状态数据存储到 'localStorage' 中。在应用重新加载时，会从 'localStorage' 中读取数据并初始化 Pinia 的状态。这样就实现了 Pinia 的永久化存储。