前端存取localStroge和sessionStroge数据方法

本文介绍了如何在用户登录时利用localStorage和sessionStorage保存与验证token,展示了数据存取的方法,包括JSON格式转换,并提及了清除存储的使用场景,如用户退出登录。

一般在用户登录的时候我们会把token和用户信息存到里面,方便在用户刷新的时候验证token和在其他的页面使用到用户的信息
将数据保存到localStroge中方法

window.localStorage.setItem(key, JSON.stringify(value));

在这里插入图片描述
key和vaule分别对应图中
获取localStroge中的数据方法(获取数据的时候要注意JSON数据格式的转换,不然会报错)

JSON.parse(window.localStorage.getItem(key);

我举个栗子
先存我需要的数据,可以是对象可以是字符串,一般存JSON数据

window.localStorage.setItem('3', JSON.stringify('我是存进来的数据'));

在这里插入图片描述
下面取刚刚存的数据,记住我们刚刚存的是JSON格式的数据,所以我们要先转一次数据格式

const aaa = JSON.parse(window.localStorage.getItem('3'));

打印一下取出来数据

console.log('我是取出来的数据---->',aaa);

在这里插入图片描述
同理sessionStroge存取方法分别是
window.sessionStorage.setItem(key, JSON.stringify(value));
JSON.parse(window.sessionStorage.getItem(key) || defaultVal || ‘{}’);

删除保存的数据
sessionStorage.removeItem(‘key’);

清除所有stroge
localStorage.clear();
一般在用户退出登录时使用

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值