一、实现该需求的思路:因为localStorage的特性是永久保存,但现在我们要对他进行达到一定时间后自动过期又得怎麽做呢,所以,我就在时间上对他进行了操作,当我们存入数据的时候,一并将当时的时间也存进去,然后设置在未来的某一时间,达到那个时间的时候删除数据,也就形成了类似的过期功能,不懂local什么意思的自行查看我的另一篇原创文章--------Vue数据存储本地localStorage ES6-Map存本地Value未定义
data: function() {
return{
data:[],
getBaseList:[]
}
},
mounted:function(){
var _this = this
_this.getBaseList = local.get('baseDataList')
if(_this.getBaseList==='' || _this.getBaseList.serise==undefined){
_this.getBaseData();
}else{
var nextNewTime = ''
nextNewTime = new Date().getTime()
_this.getBaseList = local.get('baseDataList')
var timeLag = nextNewTime-(_this.getBaseList.serise)
if(timeLag>=7200000){ //2小时后删除
local.remove('baseDataList')
_this.getBaseData();
}else{
_this.data = _this.getBaseList.listAll
}
}
},
methods:{
getBaseData:function(){
var _this=this;
var timeNew = ''
var listSerise = {}
$.ajax({
type: 'post',
url: '../../../data/coor.json',
data: {},
dataType:'json',
success: function (data) {
if (data.status === 200) {
_this.data=data.body.data;
timeNew = new Date().getTime()
listSerise = {
listAll:_this.data,
serise:timeNew
}
local.set("baseDataList", listSerise);
}else{
_this.$Message.error(data.message)
}
},
error: function () {
_this.$Message.error('请求失败,请稍后重试!')
}
});
},
},