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


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 相关文章推荐
extJs 文本框后面加上说明文字+下拉列表选中值后触发事件
Nov 27 Javascript
JS 添加网页桌面快捷方式的代码详细整理
Dec 27 Javascript
jquery ajax jsonp跨域调用实例代码
Dec 11 Javascript
js点击button按钮跳转到另一个新页面
Oct 10 Javascript
javascript查询字符串参数的方法
Jan 28 Javascript
Bootstrap的modal拖动效果
Dec 25 Javascript
Bootstrap实现基于carousel.js框架的轮播图效果
May 02 Javascript
Jquery获取radio选中的值
May 05 jQuery
angularjs 动态从后台获取下拉框的值方法
Aug 13 Javascript
微信小程序数据分析之自定义分析的实现
Aug 17 Javascript
详解vscode中vue代码颜色插件
Oct 11 Javascript
JS轻量级函数式编程实现XDM二
Jun 16 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
php explode函数实例代码
2012/02/27 PHP
PHP重置数组为连续数字索引的几种方式总结
2018/03/12 PHP
ThinkPHP类似AOP思想的参数验证的实现方法
2019/12/18 PHP
JavaScript 图片预览效果 推荐
2009/12/22 Javascript
JQuery选择器绑定事件及修改内容的方法
2015/01/23 Javascript
使用RequireJS优化JavaScript引用代码的方法
2015/07/01 Javascript
基于jquery实现的树形菜单效果代码
2015/09/06 Javascript
Jquery 自定义事件实现发布/订阅的简单实例
2016/06/12 Javascript
JS获取当前使用的浏览器名字以及版本号实现方法
2016/08/19 Javascript
解析AngularJS中get请求URL出现的跨域问题
2016/12/01 Javascript
深入理解Javascript中的作用域链和闭包
2017/04/25 Javascript
Webpack打包css后z-index被重新计算的解决方法
2017/06/18 Javascript
vue 计时器组件的实现代码
2017/09/14 Javascript
手动用webpack搭建第一个ReactApp的示例
2018/04/11 Javascript
原生js通过一行代码实现简易轮播图
2019/06/05 Javascript
Python3基础之list列表实例解析
2014/08/13 Python
python 安装virtualenv和virtualenvwrapper的方法
2017/01/13 Python
简单谈谈Python中的元祖(Tuple)和字典(Dict)
2017/04/21 Python
Python语言生成水仙花数代码示例
2017/12/18 Python
python 3.6 +pyMysql 操作mysql数据库(实例讲解)
2017/12/20 Python
python中的字典操作及字典函数
2018/01/03 Python
在pandas多重索引multiIndex中选定指定索引的行方法
2018/11/16 Python
Python简单获取二维数组行列数的方法示例
2018/12/21 Python
python使用Plotly绘图工具绘制水平条形图
2020/03/25 Python
在Qt中正确的设置窗体的背景图片的几种方法总结
2019/06/19 Python
python matplotlib拟合直线的实现
2019/11/19 Python
Lookfantastic西班牙官网:英国知名美妆购物网站
2018/06/13 全球购物
整个世界的设计师家具在哈恩:Designathome
2019/03/25 全球购物
秘书专业自荐信范文
2013/12/26 职场文书
告诉你怎样写创业计划书
2014/01/27 职场文书
毕业评语大全
2014/05/04 职场文书
异地年检委托书范本
2014/09/24 职场文书
流动人口婚育证明范本
2014/09/26 职场文书
公司年夜饭通知
2015/04/25 职场文书
MySQL主从复制断开的常用修复方法
2021/04/07 MySQL
spring IOC容器的Bean管理XML自动装配过程
2022/05/30 Java/Android