微信小程序提供的本地缓存api是个好东西,但是没有明确指定缓存有效期,对于某些应用来说,需要改造一下,方法思路很简单,也很常见通用的一个封装函数方法!
实现
新建wxCache.js
/**
* 本地缓存
* @param key 缓存参数
* @param value 缓存值
* @param time 缓存时间(小时为单位,传1,就意味缓存1个小时) 非必传
* */
export default class wxCache {
//ES6 提供了更接近传统语言的写法,引入了 Class(类)这个概念,作为对象的模板。
constructor() {
this.now = new Date().getTime();// 获取当前时间
}
// 获取
getCache(key) {
this.now = new Date().getTime();// 获取当前时间
let time = wx.getStorageSync(key).time || false;// 获取缓存时间
if(time) {
if (parseInt(time) >= this.now ) {
// console.log('还没过期')
return wx.getStorageSync(key).value
}else {
// console.log('过期啦')
this.removeCache(key);// 删除字段info
return false
}
}else {
// 没有设置时间处理返回
return wx.getStorageSync(key)
}
};
/**
* 设置缓存
* @param key 缓存参数
* @param value 缓存值
* @param time 缓存时间(小时为单位,传1,就意味缓存1个小时) 非必传
* */
setCache(key,value,time) {
let data;
if(time) {
let timefrom = parseInt(Number(time)*60*60*1000); // 小时转化毫秒
data = {
value: value,
time: timefrom + this.now
}
}else {
data = value;
}
wx.setStorageSync(key, data);
};
// 移除
removeCache(key) {
console.log('删除')
wx.removeStorageSync(key);
};
// 清空所有
clearallCache() {
wx.clearStorageSync();
}
}
app.js 全局导入
import wxCache from './common/wxCache.js'// 导入wxCache.js
App({
data:{},
wxCache:new wxCache(),// 全局导入
})
使用
// 设置key为huancun,value为 '123',时间缓存时间为1小时
app.wxCache.setCache('huancun','123',1);
// 获取key为huancun的value
app.wxCache.getCache('huancun');
// 移除key为huancun的缓存
app.clearallCache('huancun');
// 清空所有缓存
app.clearallCache();