vue项目持久化存储数据的实现代码
作者:水痕01 时间:2024-04-27 15:59:48
方式一、使用localStorage在数据存储
1、要在浏览器刷新的时候重新存储起来
if (window.localStorage.getItem(authToken)) {
store.commit(types.SETLOANNUMBER, window.localStorage.getItem('loanNumber'));
}
方式二、使用vue-cookie插件来做存储
1、参考地址传送门
2、安装包
npm install vue-cookie --save
3、在store中存储起来
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex)
var VueCookie = require('vue-cookie');
export default new Vuex.Store({
state: {
token: VueCookie.get('token')
},
mutations: {
saveToken(state, token) {
state.token = token;
// 设置存储
VueCookie.set('token', token, { expires: '30s' });
}
},
actions: {
}
})
4、在登录页面中设置到存储中
import { mapMutations } from 'vuex';
export default {
methods: {
login() {
this.saveToken('123')
},
...mapMutations(['saveToken'])
}
};
方式三、使用vuex-persistedstate插件参考文件
在做大型项目,很多数据需要存储的建议使用这种方式
来源:https://blog.csdn.net/kuangshp128/article/details/82379575
标签:vue,项目,持久化存储
![](/images/zang.png)
![](/images/jiucuo.png)
猜你喜欢
Django中数据在前后端传递的方式之表单、JSON与ajax
2022-08-09 11:32:44
mac系统下Redis安装和使用步骤详解
2022-11-29 11:54:21
一文秒懂python读写csv xml json文件各种骚操作
2023-08-03 23:50:42
Python基础之输入,输出与高阶赋值详解
2023-05-21 10:00:32
设计师如何更有效拿到结果?
2008-09-22 20:30:00
![](https://img.aspxhome.com/file/UploadPic/20089/22/2008922203620332s.jpg)
Python matplotlib绘制图形实例(包括点,曲线,注释和箭头)
2021-08-31 22:57:06
![](https://img.aspxhome.com/file/2023/0/99110_0s.jpg)
Qt操作SQLite数据库的教程详解
2024-01-16 14:10:04
![](https://img.aspxhome.com/file/2023/5/103085_0s.png)
python 根据网易云歌曲的ID 直接下载歌曲的实例
2021-01-15 19:48:47
![](https://img.aspxhome.com/file/2023/5/101205_0s.jpg)
vue中的input框点击后不聚焦问题
2024-05-02 16:33:12
go-cqhttp环境配置及安装过程
2024-04-26 17:30:46
![](https://img.aspxhome.com/file/2023/1/134021_0s.png)
解决给dom元素绑定click等事件无效问题的方法
2024-04-16 10:36:42
Python Scrapy图片爬取原理及代码实例
2022-04-29 05:51:06
Python简单格式化时间的方法【strftime函数】
2023-03-29 11:30:16
Python虚拟环境项目实例
2023-03-07 16:59:01
![](https://img.aspxhome.com/file/2023/1/100881_0s.png)
有序列表 li ol
2008-07-30 12:31:00
mysql Event Scheduler: Failed to open table mysql.event
2024-01-24 13:03:56
![](https://img.aspxhome.com/file/2023/8/128018_0s.png)
sqlserver 导出插入脚本代码
2024-01-26 22:39:18
django 实现编写控制登录和访问权限控制的中间件方法
2021-04-26 21:08:53
JavaScript控制输入框中只能输入中文、数字和英文的方法【基于正则实现】
2024-04-16 08:50:16
![](https://img.aspxhome.com/file/2023/8/136858_0s.jpg)
基于python实现坦克大战游戏
2023-01-29 01:48:30
![](https://img.aspxhome.com/file/2023/9/133539_0s.jpg)