1.0.1 • Published 1 year ago
pinia-plugin-lasting v1.0.1
pinia-plugin-lasting
一个基于 pinia 的状态持久化插件
安装
npm install pinia-plugin-lasting
引入
在你的入口文件当中
import { createApp } from 'vue'
import { createPinia } from 'pinia'
// 引入 pinia-plugin-lasting
import piniaPlugin from 'pinia-plugin-lasting'
import App from './App.vue'
const store = createPinia()
const app = createApp(App)
// 使用插件
store.use(piniaPlugin)
app.use(store)
app.mount('#app')
快速使用
import { defineStore } from 'pinia'
export const useIndexStore = defineStore('index', {
state: () => {
return {
theme: 'auto'
}
},
// 仓库配置
lasting: {
// enabled 属性表示是否开启持久化配置,值为一个 boolean 类型,必传项
enabled: true,
// strategies 存储策略,可选(包括其中的所有属性均为可选项),不传均使用默认配置
strategies: {}
}
})
如果你的使用了 pinia-plugin-lasting 插件在你的每个 pinia 仓库中除了 state、action、getter 会多一个 lasting 属性,值为一个配置对象
如果你想要将整个 store 的状态都变成持久化只需要这样设置即可,当然你也可以这样配置一个详细的:
import { defineStore } from 'pinia'
export const useIndexStore = defineStore('index', {
state: () => {
return {
theme: 'auto',
aaa: 'bbb'
}
},
lasting: {
enabled: true,
strategies: {
// key 存储时的键名请保持唯一性就像仓库的 id 一样,默认为仓库 id
key: 'xxx',
// storage 存储对象,提供两个选项: sessionStorage、localStorage
storage: sessionStorage,
// exclude 排除掉那些不需要持久化的状态属性,值为 state 中的键名
exclude: ['aaa']
}
}
})