Pinia 状态管理的数据持久化 (pinia-plugin-persistedstate)
Pinia 状态管理的数据持久化推荐使用(pinia-plugin-persistedstate)pinia-plugin-persist也可以,但是有一些bug 。
·
1.pinia:
1.一文搞懂pinia状态管理(保姆级教程) - 知乎
2.Pinia 中文文档3. pinia-persistedstate-plugin官网地址: Getting Started | pinia-plugin-persistedstate
2. pinia-plugin-persistedstate:
2.1 下载
npm:npm install pinia-persistedstateyarn:yarn add pinia-persistedstate
2.2 main.ts 引用
// 依赖pinia
import {
createPinia } from 'pinia'
// 引入数据持久化插件
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
// 注册
const pinia = createPinia()
pinia.use(piniaPluginPersistedstate)
2.3 简单使用
import { defineStore } from 'pinia';
// 存取地图经纬度
export interface MapState {
locations: Array<string>;
address: string;
}
export const useMapStore = defineStore('map', {
state: (): MapState => ({
locations: [],
address: '',
}),
getters: {},
actions: {
setLocation(location: Array<string>, adress: string): void {
this.locations = location;
this.address = adress;
},
setAdress(address: string) {
this.address = address;
},
clearMessage() {
this.address = '';
this.locations = [];
},
},
persist: {
key: 'map',
storage: sessionStorage,
},
});
3.其他说明
Pinia 的 状态管理的数据持久化 还可以使用 pinia-plugin-persist , 但是 不推荐使用 ,在使用pinia-plugin-persist的过程中,出现了一些bug ,比如使用过程中数据改变 storage 没有更新。
所以 推荐使用 pinia-plugin-persistedstate。
更多推荐
已为社区贡献1条内容
所有评论(0)