微信小程序 数据缓存实现方法详解


Posted in Javascript onAugust 26, 2019

微信小程序可以通过wx.setStorage(wx.setStorageSync)、wx.getStorage(wx.getStorageSync)、wx.clearStorage(wx.clearStorageSync)对本地缓存进行设置、获取和清理。本地缓存最大为10MB。

wx.setStorage()---------异步设置缓存

微信官方给出的属性

OBJECT参数说明:

参数 类型 必填 说明
key String 本地缓存中的指定的 key
data Object/String 需要存储的内容
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

调用方式:

wx.setStorage({
 key:"key",
 data:"value"
})

wx.setStorageSync()---------同步设置缓存

微信官方给出的属性

参数说明:

参数 类型 必填 说明
key String 本地缓存中的指定的 key
data Object/String 需要存储的内容

调用方式:

try {
  wx.setStorageSync('key', 'value')
} catch (e) {  
}

wx.getStorage()--------异步获取缓存

微信官方给出的属性

OBJECT参数说明:

参数 类型 必填 说明
key String 本地缓存中的指定的 key
success Function 接口调用的回调函数,res = {data: key对应的内容}
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

success返回参数说明:

参数 类型 说明
data String key对应的内容

调用方式:

wx.getStorage({
 key: 'key',
 success: function(res) {
   console.log(res.data)
 } 
})

wx.getStorageSync()--------同步获取缓存数据

微信官方给出的属性说明

参数说明:

参数 类型 必填 说明
key String 本地缓存中的指定的 key

调用方式:

try {
 var value = wx.getStorageSync('key')
 if (value) {
   // Do something with return value
 }
} catch (e) {
 // Do something when catch error
}

wx.getStorageInfo()------异步获取当前缓存的数据

微信官方给出的属性说明

OBJECT参数说明:

参数 类型 必填 说明
success Function 接口调用的回调函数,详见返回参数说明
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

success返回参数说明:

参数 类型 说明
keys String Array 当前storage中所有的key
currentSize Number 当前占用的空间大小, 单位kb
limitSize Number 限制的空间大小,单位kb

调用方式:

wx.getStorageInfo({
 success: function(res) {
  console.log(res.keys)
  console.log(res.currentSize)
  console.log(res.limitSize)
 }
})

wx.getStorageInfoSync()-------同步获取当前缓存数据

emmmmm---微信并没有给参数说明

调用方式:

try {
 var res = wx.getStorageInfoSync()
 console.log(res.keys)
 console.log(res.currentSize)
 console.log(res.limitSize)
} catch (e) {
 // Do something when catch error
}

wx.removeStorage()-----异步移除指定的key的缓存数据

微信官方参数说明

OBJECT参数说明:

参数 类型 必填 说明
key String 本地缓存中的指定的 key
success Function 接口调用的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

调用方式:

wx.removeStorage({
 key: 'key',
 success: function(res) {
  console.log(res.data)
 } 
})

wx.removeStorageSync()------同步移除指定key的缓存数据

微信官方参数说明

参数说明:

参数 类型 必填 说明
key String 本地缓存中的指定的 key

调用方式:

try {
 wx.removeStorageSync('key')
} catch (e) {
 // Do something when catch error
}

wx.clearStorage()------异步清理本地缓存

调用方式:

wx.clearStorage()

wx.clearStorageSync()-------同步清理本地缓存

调用方式:

try {
  wx.clearStorageSync()
} catch(e) {
 // Do something when catch error
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
阻止JavaScript事件冒泡传递(cancelBubble 、stopPropagation)
May 08 Javascript
js(jQuery)获取时间的方法及常用时间类搜集
Oct 23 Javascript
jQuery判断邮箱格式对错实例代码讲解
Apr 12 jQuery
vue+axios实现登录拦截的实例代码
May 22 Javascript
node.js 核心http模块,起一个服务器,返回一个页面的实例
Sep 11 Javascript
vue-cli中打包图片路径错误的解决方法
Oct 26 Javascript
浅谈手写node可读流之流动模式
Jun 01 Javascript
JS的函数调用栈stack size的计算方法
Jun 24 Javascript
Vue+Mock.js模拟登录和表格的增删改查功能
Jul 26 Javascript
JavaScript引用类型RegExp基本用法详解
Aug 09 Javascript
详解如何配置vue-cli3.0的vue.config.js
Aug 23 Javascript
如何在Vue中抽离接口配置文件
Oct 31 Javascript
使用typescript构建Vue应用的实现
Aug 26 #Javascript
微信小程序实现手势滑动卡片效果
Aug 26 #Javascript
微信小程序实现左侧滑栏过程解析
Aug 26 #Javascript
vue柱状进度条图像的完美实现方案
Aug 26 #Javascript
React传值 组件传值 之间的关系详解
Aug 26 #Javascript
js实现指定时间倒计时效果
Aug 26 #Javascript
Vue.use()在new Vue() 之前使用的原因浅析
Aug 26 #Javascript
You might like
laravel-admin 实现给grid的列添加行数序号的方法
2019/10/08 PHP
Nigma vs Alliance BO5 第四场2.14
2021/03/10 DOTA
获取URL地址中的文件名和参数的javascript代码
2009/09/02 Javascript
高性能web开发 如何加载JS,JS应该放在什么位置?
2010/05/14 Javascript
理解JavaScript中的对象 推荐
2011/01/09 Javascript
7款风格新颖的jQuery/CSS3菜单导航分享
2013/04/23 Javascript
JavaScript中的对象序列化介绍
2014/12/30 Javascript
JavaScript中的变量作用域介绍
2014/12/31 Javascript
javascript实现检验的各种规则
2015/07/31 Javascript
基于Vuejs框架实现翻页组件
2020/06/29 Javascript
详解vue-cli与webpack结合如何处理静态资源
2017/09/19 Javascript
微信小程序实现自定义picker选择器弹窗内容
2020/05/26 Javascript
js实现京东秒杀倒计时功能
2019/01/21 Javascript
利用vue重构有赞商城的思路以及总结整理
2019/02/21 Javascript
原生JS使用Canvas实现拖拽式绘图功能
2019/06/05 Javascript
ES6 Generator基本使用方法示例
2020/06/06 Javascript
Python中的列表生成式与生成器学习教程
2016/03/13 Python
浅谈Python类的__getitem__和__setitem__特殊方法
2016/12/25 Python
Python3.5基础之变量、数据结构、条件和循环语句、break与continue语句实例详解
2019/04/26 Python
python儿童学游戏编程知识点总结
2019/06/03 Python
Python list与NumPy array 区分详解
2019/11/06 Python
python turtle 绘制太极图的实例
2019/12/18 Python
用python解压分析jar包实例
2020/01/16 Python
Python如何进行时间处理
2020/08/06 Python
美国领先的家庭智能音响系统品牌:Sonos
2018/07/20 全球购物
应届大学生自荐信
2013/12/05 职场文书
教师实习自我鉴定
2013/12/18 职场文书
酒店营销策划方案
2014/02/07 职场文书
支部鉴定材料
2014/06/02 职场文书
2015年度个人业务工作总结
2015/04/27 职场文书
计划生育责任书
2015/05/09 职场文书
新闻稿件写作技巧
2015/07/18 职场文书
运动会宣传稿100字
2015/07/23 职场文书
mysql timestamp比较查询遇到的坑及解决
2021/11/27 MySQL
python多线程方法详解
2022/01/18 Python
Win11安全功能升级:内置防网络钓鱼功能
2022/04/08 数码科技