一、前言

 

開發客戶端時常會用到一些非永久緩存的需求，而微信緩存只能按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原生的即可。

三、框架講解

 

1. put(k, v, t)
2.  
3. function put(k, v, t) {
4. // console.log(k);
5. wx.setStorageSync(k, v)
6. var seconds = parseInt(t);
7. if (seconds > 0) {
8. var timestamp = Date.parse(new Date());
9. timestamp = timestamp / 1000 + seconds;
10. // console.log(timestamp);
11. wx.setStorageSync(k + postfix, timestamp + "")
12. } else {
13. wx.removeStorageSync(k + postfix)
14. }
15. }

先存儲key的數據（字符串、數組、json），再判斷過期時間是否大于0，當大于0時，存儲key+一個后綴，內容為當前時間戳（單位秒）+有效時間t。

get(k, def)

1. function get(k, def) {
2. var deadtime = parseInt(wx.getStorageSync(k + postfix))
3. if (deadtime) {
4. if (parseInt(deadtime) < Date.parse(new Date()) / 1000) {
5. if (def) { return def; } else { return; }
6. }
7. }
8. var res = wx.getStorageSync(k);
9. if (res) {
10. return res;
11. } else {
12. return def;
13. }
14. }

get方法，先通過key+一個后綴得到時間戳，如果時間戳存在，切小于當前時間，說明過期；【那么，當有默認值時返回默認值（包含字符串、數組、json），否則返回空。】當沒過期時，正常讀取key的內容，key存在時正常返回；否則返回默認值，當不存在默認值時返回空。

其他方法

1. function remove(k) {
2. wx.removeStorageSync(k);
3. wx.removeStorageSync(k + postfix);
4. }
5.  
6. function clear() {
7. wx.clearStorageSync();
8. }

remove(k)需要移除2個key，因為存儲的時候，可能存了時間戳，當然即使不存在key，移除也是不會報錯的。

四、如何使用

 

下載src文件夾內wCache.js文件  需要使用的js文件頭加入var wc = require('../../src/wcache.js')。  var s=wc.get('k', '你好')、wc.put('k', 'string你好啊')等;  使用例子

1. get(e) {
2. this.setData({
3. text: null
4. });
5. switch (e.currentTarget.dataset.type) {
6. case "def":
7. this.setData({
8. text: wc.get('k')
9. });
10. break;
11. case "string":
12. this.setData({
13. text: wc.get('k', '你好')
14. });
15. break;
16. case "json":
17. this.setData({
18. text: wc.get('k', { "a": "1" })
19. });
20. break;
21. }
22.  
23. }
24. put(e) {
25. console.log(e);
26. switch (e.currentTarget.dataset.type) {
27. case "string":
28. wc.put('k', 'string你好啊');
29. break;
30. case "json":
31. wc.put('k', { "b": "3" }, 2);
32. break;
33. case "list":
34. wc.put('k', [1, 2, 3]);
35. break;
36. case "boolean":
37. wc.put('k', true);
38. break;
39. }
40. wx.showToast({
41. title: '存儲成功',
42. duration: 500,
43. })
44. }