二次封装的缓存框架wCache(支持缓存时间、默认值)--微信小程序

一、前言

开发客户端时常会用到一些非永久缓存的需求,而微信缓存只能按key永久缓存;其次,当读取缓存失败时,有时需要给个默认值,所以得二次判断下,今天想了一下何不封装一个缓存框架。

二、支持方法

put(k, v, t)

k为key,v为具体内容(支持字符串、json、数组、boolean等等),t为可选参数表示有效时间(单位:秒)
如存储k为123过期时间1秒,则调用put(‘k’, ‘123’, 1)方法;若永久存储调用put(‘k’, ‘123’)
永久保存json:put(‘k’, {“a”:”1”}),数组、boolean等同理。

get(k, def)

k为key,def为可选参数,表示无缓存数据时返回值(支持字符串、json、数组、boolean等等)
如读取k缓存,则调用get(‘k’);若想要无缓存时,返回默认值则get(‘k’,’默认值’),支持各个数据类型。

remove(k)

移除某个key

clear()

清空所有key

其他方法

使用wx原生的即可。

三、框架讲解

put(k, v, t)

function put(k, v, t) {
  // console.log(k);
  wx.setStorageSync(k, v)
  var seconds = parseInt(t);
  if (seconds > 0) {
    var timestamp = Date.parse(new Date());
    timestamp = timestamp / 1000 + seconds;
    // console.log(timestamp);
    wx.setStorageSync(k + postfix, timestamp + "")
  } else {
    wx.removeStorageSync(k + postfix)
  }
}

先存储key的数据(字符串、数组、json),再判断过期时间是否大于0,当大于0时,存储key+一个后缀,内容为当前时间戳(单位秒)+有效时间t。

get(k, def)

function get(k, def) {
  var deadtime = parseInt(wx.getStorageSync(k + postfix))
  if (deadtime) {
    if (parseInt(deadtime) < Date.parse(new Date()) / 1000) {
      if (def) { return def; } else { return; }
    }
  }
  var res = wx.getStorageSync(k);
  if (res) {
    return res;
  } else {
    return def;
  }
}

get方法,先通过key+一个后缀得到时间戳,如果时间戳存在,切小于当前时间,说明过期;【那么,当有默认值时返回默认值(包含字符串、数组、json),否则返回空。】当没过期时,正常读取key的内容,key存在时正常返回;否则返回默认值,当不存在默认值时返回空。

其他方法

function remove(k) {
  wx.removeStorageSync(k);
  wx.removeStorageSync(k + postfix);
}

function clear() {
  wx.clearStorageSync();
}

remove(k)需要移除2个key,因为存储的时候,可能存了时间戳,当然即使不存在key,移除也是不会报错的。

四、如何使用

  1. 下载src文件夹内wCache.js文件
  2. 需要使用的js文件头加入var wc = require(‘../../src/wcache.js’)。
  3. var s=wc.get(‘k’, ‘你好’)、wc.put(‘k’, ‘string你好啊’)等;

使用例子

 get(e) {
    this.setData({
      text: null
    });
    switch (e.currentTarget.dataset.type) {
      case "def":
        this.setData({
          text: wc.get('k')
        });
        break;
      case "string":
        this.setData({
          text: wc.get('k', '你好')
        });
        break;
      case "json":
        this.setData({
          text: wc.get('k', { "a": "1" })
        });
        break;
    }

  }
  put(e) {
    console.log(e);
    switch (e.currentTarget.dataset.type) {
      case "string":
        wc.put('k', 'string你好啊');
        break;
      case "json":
        wc.put('k', { "b": "3" }, 2);
        break;
      case "list":
        wc.put('k', [1, 2, 3]);
        break;
      case "boolean":
        wc.put('k', true);
        break;
    }
    wx.showToast({
      title: '存储成功',
      duration: 500,
    })
  }

源码地址:https://github.com/qq273681448/wCache

觉得好的话,记得关注我哦!
csdn博客:
http://blog.csdn.net/qq273681448/
简书:
http://www.jianshu.com/users/ef6207f116a2/timeline
掘金:
https://juejin.im/user/57cd55218ac247006459c40c
Github:
https://github.com/qq273681448

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值