pinia的永久化存储怎么弄
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 的永久化存储。
原文地址: https://www.cveoy.top/t/topic/09N 著作权归作者所有。请勿转载和采集!