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


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 相关文章推荐
jquery实现excel导出的方法
Apr 04 Javascript
原生JavaScript编写canvas版的连连看游戏
May 29 Javascript
获取JS中网页各种高宽与位置的方法总结
Jul 27 Javascript
浅谈js的ajax的异步和同步请求的问题
Oct 07 Javascript
如何在Angular.JS中接收并下载PDF
Nov 26 Javascript
Vue.js实现文章评论和回复评论功能
May 30 Javascript
vue.js计算属性computed用法实例分析
Jul 06 Javascript
Angular使用cli生成自定义文件、组件的方法
Sep 04 Javascript
Vuejs学习笔记之使用指令v-model完成表单的数据双向绑定
Apr 29 Javascript
JS实现点击下拉列表文本框中出现对应的网址,点击跳转按钮实现跳转
Nov 25 Javascript
JavaScript 监听组合按键思路及代码实现
Jul 28 Javascript
在vue中使用eslint,配合vscode的操作
Nov 09 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+DBM的同学录程序(3)
2006/10/09 PHP
php操作JSON格式数据的实现代码
2011/12/24 PHP
PHP分多步骤填写发布信息的简单方法实例代码
2012/09/23 PHP
深入extjs与php参数交互的详解
2013/06/25 PHP
浅析echo(),print(),print_r(),return之间的区别
2013/11/27 PHP
PHP-FPM实现性能优化
2016/03/31 PHP
基于CI框架的微信网页授权库示例
2016/11/25 PHP
PHP/HTML混写的四种方式总结
2017/02/27 PHP
捕获键盘事件(且兼容各浏览器)
2013/07/03 Javascript
Javascript改变CSS样式(局部和全局)
2013/12/18 Javascript
从QQ网站中提取的纯JS省市区三级联动菜单
2013/12/25 Javascript
推荐 21 款优秀的高性能 Node.js 开发框架
2014/08/18 Javascript
原生js实现移动开发轮播图、相册滑动特效
2015/04/17 Javascript
浅述Javascript的外部对象
2016/12/07 Javascript
JavaScript对象引用与赋值实例详解
2017/03/15 Javascript
Angularjs 双向绑定时字符串的转换成数字类型的问题
2017/06/12 Javascript
CentOS7中源码编译安装NodeJS的完整步骤
2018/10/13 NodeJs
简谈创建React Component的几种方式
2019/06/15 Javascript
mpvue微信小程序开发之实现一个弹幕评论
2019/11/24 Javascript
vue使用swiper实现中间大两边小的轮播图效果
2019/11/24 Javascript
使用python读取csv文件快速插入数据库的实例
2018/06/21 Python
python+mysql实现教务管理系统
2019/02/20 Python
Django分组聚合查询实例分享
2020/04/29 Python
Django ORM 查询表中某列字段值的方法
2020/04/30 Python
意大利香水和彩妆护肤品购物网站:Ditano
2017/08/13 全球购物
Paper Cape官网:美国婴儿和儿童服装品牌
2019/11/02 全球购物
美国折扣香水网站:The Perfume Spot
2020/12/12 全球购物
PyQt QMainWindow的使用示例
2021/03/24 Python
最新奶茶店创业计划书
2014/01/25 职场文书
秋季运动会活动方案
2014/02/05 职场文书
大学生演讲稿
2014/04/25 职场文书
房屋产权共有协议书范本
2014/11/03 职场文书
2014年学生工作总结
2014/11/20 职场文书
感恩节寄语2015
2015/03/24 职场文书
WINDOWS 64位 下安装配置mysql8.0.25最详细的教程
2022/03/22 MySQL
css如何把元素固定在容器底部的四种方式
2022/06/16 HTML / CSS