当前位置:网站首页>pinia的持久化存储,pinia使用插件进行持久化存储。
pinia的持久化存储,pinia使用插件进行持久化存储。
2022-07-27 04:00:00 【道长道长IOT】
1.安装pinia持久化插件
npm i pinia-plugin-persist -S
优化1:pinia放在main.js中让主文件显得有一些臃肿,那么我们现在先处理这个问题
1.在src目录下新建一个index.js文件,写入如下内容,对插件进行注册使用
import {
createPinia } from 'pinia'
// 引入持久化插件
import piniaPluginPersist from 'pinia-plugin-persist'
const store = createPinia()
// 使用该插件
store.use(piniaPluginPersist)
//导出
export default store
2.在main.js中进行注册
import {
createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from '@/store'
const app = createApp(App)
app.use(store).use(router).mount('#app')
3.在store文件夹下新建一个test.js文件,让我们来使用持久化插件
import {
defineStore } from 'pinia'
import axios from 'axios'
export default defineStore('main', {
state: () => {
return {
count: 10,
name: '何志伟',
list: [{
name: 'ipone',
price: 5800,
count: 1
},
{
name: 'huawei',
price: 5800,
count: 2
}],
timuList: []
}
},
// 使用该插件,开启数据缓存
persist: {
//这里存储默认使用的是session
enabled: true,
strategies: [
{
//key的名称
key: 'my_user',
//更改默认存储,我更改为localStorage
storage: localStorage,
// 可以选择哪些进入local存储,这样就不用全部都进去存储了
// 默认是全部进去存储
paths: ['list']
}
]
}
})
边栏推荐
- Ribbon load balancing strategy and configuration, lazy loading and hungry loading of ribbon
- 通信协议综述
- ASP voice notification interface docking demo
- Using JSON type to realize array function in MySQL
- People don't talk much, engineers don't talk much
- STM32 serial port based on Hal library accepts interrupts and idle interrupts
- 安全第四次课后练习
- 佳明手表怎么设置用户定制显示
- Network knowledge corner | it only takes four steps to teach you to use SecureCRT to connect to ENSP. You must see the operation guide of common tools
- Word/Excel 固定表格大小,填写内容时,表格不随单元格内容变化
猜你喜欢

Anonymous named pipes, understanding and use of interprocess communication in shared memory

结构型模式-适配器模式

从零开始C语言精讲篇4:数组

电商分账系统重要吗,平台应该如何选择分账服务商呢?

Playwright web crawler actual battle case sharing

安全第四次课后练习

使用WebMvcConfigurer进行接口请求拦截进行中增强(附源码)

Delete the whole line of Excel, and delete the pictures together

BSN IPFs (interstellar file system) private network introduction, functions, architecture and characteristics, access instructions

微服务的feign调用header头被丢弃两种解决方案(附源码)
随机推荐
xxx is not in the sudoers file.This incident will be reported.的解决方法
GenericServlet为什么有两个init方法
e.target与e.currentTarget的区别
Eureka service registry
P1438 boring sequence line segment tree + difference
【软件工程期末复习】知识点+大题详解(E-R图、数据流图、N-S盒图、状态图、活动图、用例图....)
Eureka-服务注册中心
佳明手表怎么设置用户定制显示
Standard C language 13
els 兼容性DC、传递图片到窗口
js三种遍历数组的方法:map、forEach、filter
Rust:axum learning notes (1) Hello World
Convolution neural network -- convolution of gray image
Practice of microservice in solving Library Download business problems
EVT interface definition file of spicy
ASP voice notification interface docking demo
Introduction to regular expressions of shell, general matching, special characters: ^, $,., * Character range (brackets): [], special characters: \, matching mobile phone number
华为入局商用市场:趋势使然,挑战颇多
The data in echart histogram is displayed at the top of the chart
Ant JD Sina 10 architects 424 page masterpiece in-depth distributed cache from principle to practice pdf