localStorage 设置过期时间？-阿里云开发者社区

localStorage 设置过期时间？

2022-11-27 119

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介： localStorage 设置过期时间？

1、如何不刷新页面改版URL参数

window.history.pushState(state,title,url)

pushState() 带有三个参数：
一个状态对象，
一个标题，
以及一个可选的URL地址。
state: 一个与添加的记录相关联的状态对象，主要用于popstate事件。该事件触发时，该对象会传入回调函数。也就是说，浏览器会将这个对象序列化以后保留在本地，重新载入这个页面的时候，可以拿到这个对象。如果不需要这个对象，此处可以不填
url：新的网址，必须与当前页面处在同一个域。浏览器的地址栏将显示这个网址。
title：新页面的标题。但是，现在所有浏览器都忽视这个参数，所以这里可以填空字符串。

2、根据数量计算换行显示展开收起

1、需求如图

在一行超过指定数量后，可能数量超过，也可能单个文字长度达到，出现展开按钮。

2、解决办法

1、计算一行大概能够显示几个标签，大概多少字，根据返回数量来进行切割计算是否换行了。
2、计算每一个标签的宽度，超过指定宽度显示展开按钮。

3、vue实现跳转浏览器新的标签页

let newpage = this.$router.resolve({ 
name: 'info',
query:{
type: 1,
id:id
}   
})  
window.open(newpage, '_blank');

4、localStorage 设置过期时间？

localStorage除非人为手动清除，否则会一直存在浏览器中，但可能某些情况下我们可能需要localStorage有一个过期时间，那该怎么实现？

// data 实际的值
// time 当前时间戳
// expire 过期时间
Storage.prototype.getExpire= key =>{
let val =localStorage.getItem(key);
if(!val){
return val;
    }
    val =JSON.parse(val);
if(Date.now()-val.time>val.expire){
        localStorage.removeItem(key);
return null;
    }
return val.data;
}

//使用
localStorage.setExpire("token",'xxxxxx',4000);
window.setInterval(()=>{
console.log(localStorage.getExpire("token"));
},1000)

文章标签：

JavaScript