微信小程序API---数据缓存
本地数据缓存常用于存储多页面用到的数据,例如用户头像信息、
(1)数据存储
wx.setStorage(Object object)与wx.setStorageSync(string key, any data)
wx.setStorage({
key:"key",
data:"value"
})
同步语法:
try {
wx.setStorageSync('key', 'value')
} catch (e) {
...
}
日常开发里为了数据的正确执行获取,一般使用wx.setStorageSync,即wx.setStorage 的同步版本,进行数据存储。详情参见微信小程序---存储本地缓存数据
【拓展】关于同步缓存和异步缓存的区别
以Sync(同步,同时)结尾的都是都是同步缓存,二者的区别是,异步不会阻塞当前任务,同步缓存直到同步方法处理完才能继续往下执行。
通俗点说,异步就是不管保没保存成功,程序都会继续往下执行.同步是等保存成功了,才会执行下面的代码.
使用异步,性能会更好;而使用同步,数据会更安全。
Synchronize同步
(2)获取指定 key 的内容
wx.getStorage(Object object)与wx.getStorageSync(string key)
wx.getStorage({
key: 'key',
success (res) {
console.log(res.data)
}
})
同步语法:
try {
var value = wx.getStorageSync('key')
if (value) {
// Do something with return value
}
} catch (e) {
// Do something when catch error
}
其他页面获取数据
<view class="showUserArea">
<image src="{{userInfo.avatarUrl}}"></image>
<text>{{userInfo.nickName}}</text>
</view> /* 用户展示区域 */
.showUserArea{
width: %;
height: 400rpx;
background:#388bff;
display: flex;
flex-direction: column;
align-items:center;/*垂直居中*/
justify-content: center;/*水平居中*/
}
.showUserArea>image{
width: 128rpx;
height: 128rpx;
border-radius: %;
} onShow(){
var res = wx.getStorageSync('userInfo');//获取缓存用户数据
try {
if (res) {
this.setData({
userInfo: res
}) }
} catch (e) {
// Do something when catch error }
}

遗留问题:真机测试获取失败。。。。。。。。。
(3)获取当前storage的相关信息
wx.getStorageInfo(Object object)与Object wx.getStorageInfoSync()
wx.getStorageInfo({
success (res) {
console.log(res.keys)
console.log(res.currentSize)
console.log(res.limitSize)
}
})
同步版本:
try {
const res = wx.getStorageInfoSync()
console.log(res.keys)
console.log(res.currentSize)
console.log(res.limitSize)
} catch (e) {
// Do something when catch error
}
(4)本地缓存中移除指定 key
wx.removeStorage(Object object)与wx.getStorageSync(string key)
wx.getStorage({
key: 'key',
success (res) {
console.log(res.data)
}
})
同步版本:
try {
var value = wx.getStorageSync('key')
if (value) {
// Do something with return value
}
} catch (e) {
// Do something when catch error
}
(5)清理本地数据缓存
wx.clearStorage(Object object)与wx.clearStorageSync()
wx.clearStorage() 同步版本:
try {
wx.clearStorageSync()
} catch(e) {
// Do something when catch error
}
.
微信小程序API---数据缓存的更多相关文章
- 微信小程序 API 数据缓存
微信小程序 数据缓存 (类似于 cookie) wx.setStorage() 将数据存储在本地缓存中制定的 key 中.会覆盖掉原来该 key 对应的内容,数据存储生命周期跟小程序本身一致,即除用户 ...
- 微信小程序之数据缓存
关于缓存,举个示例,假定我不是通过微信授权登录的方式,小程序又是如何识别我登录后的身份呢???效果图: 这个功能我是通过缓存实现的. 关键核心代码如下: wx.setStorage({ key: 'u ...
- 微信小程序之数据缓存和数据获取
在一个微信小程序中 避免不了的就是在多个页面获取数据,而且还会在不同的页面获取相同的数据,写起来就是一大坨,看着就不愉快 那么今天说一下 这个方法 wx.setStorage(OBJECT) 这个方法 ...
- 微信小程序---存储本地缓存数据
微信小程序之数据缓存 开发中常用setStorageSync来实现本地数据缓存操作 (1)点击缓存案例: <button bindtap="toStorage">存储& ...
- 微信小程序请求数据
微信小程序请求数据,在页面展示,可以在onLoad生命周期中进行请求. 1.新建目录http,新建文件http.js 2.在js文件中暴露需要使用的变量 var baseUrl = 'http://1 ...
- 微信小程序开放数据解密 AES-128-CBC 解密(C#版本)
最近在开发小程序,需要跟微信服务端交互,微信敏感数据都有加密返回,需要在服务端接收进行解密后再返回给客户端小程序,今天就通过C# 进行数据的解密,官方下载下来是Node.C++.php等,就是没有C# ...
- 微信小程序api拦截器
微信小程序api拦截器 完美兼容原生小程序项目 完美兼用小程序api的原本调用方式,无痛迁移 小程序api全Promise化 和axios一样的请求方式 小程序api自定义拦截调用参数和返回结果 强大 ...
- 微信小程序 API
微信小程序 API https://developers.weixin.qq.com/miniprogram/dev/component/cover-view.html demo https://de ...
- 微信小程序之本地缓存(十)
[未经作者本人同意,请勿以任何形式转载] 目前,微信给每个小程序提供了10M的本地缓存空间(哎哟妈呀好大) 有了本地缓存,你的小程序可以做到: 离线应用(已测试在无网络的情况下,可以操作缓存数据) 流 ...
随机推荐
- 【电商日志项目之六】数据分析-Hive方式
环境 hadoop-2.6.5 hive-1.2.1 一.Hive和Hbase整合如果使用Hive进行分析,Hive要从Hbase取数据(当然可以直接将数据存到Hive),那么就需要将Hive和HBa ...
- OpenJudge 4120 硬币
总时间限制: 1000ms 内存限制: 262144kB 描述 宇航员Bob有一天来到火星上,他有收集硬币的习惯.于是他将火星上所有面值的硬币都收集起来了,一共有n种,每种只有一个:面值分别为a1,a ...
- 从GitLab上创建分支本地拉取项目和提交项目详解
很多公司前端项目都是部署在GitLab上的,今天我要分享的就是如何从GitLab上创建新的分支并在本地拉取和提交项目 一.在GitLab上面创建自己新的分支 首先你得注册一个账号,登陆之后进入项目Pr ...
- Pytorch1.3源码解析-第一篇
pytorch$ tree -L 1 . ├── android ├── aten ├── benchmarks ├── binaries ├── c10 ├── caffe2 ├── CITATIO ...
- 01 Struts2框架学习(了解一下,已过时)
1.框架介绍 所谓框架,就是把一些繁琐的重复性代码封装起来,使程序员在编码中把更多的精力放到业务需求的分析和理解上面. 特点:封装了很多细节,程序员在使用的时候会非常简单. 早前,有三大框架strut ...
- 08 Tomcat+Java Web项目的创建和War的生成
1.web服务器软件:服务器:安装了服务器软件的计算机服务器软件:接收用户的请求,处理请求,做出响应 * web服务器软件:接收用户的请求,处理请求,做出响应. 在web服务器软件中,可以部署web项 ...
- react-native样式里面的一些坑
在我们做react-native项目时,引入css样式之后 控制台报下面的这样的错 解决问题的方法是: 报错的代码 改后的代码
- Centos下Redis集群的搭建实现读写分离
Centos下Redis一主多从架构搭建 搭建目标:因为自己笔记本电脑配置较低的原因,模拟两台机器之间搭建一主一从的架构,主节点Redis主要用来写数据,数据写入到主节点的Redis,然后从节点就可以 ...
- (父向子传值)组件内的properties类似与vue中的prop接收外界传递进来的参数
=================================================== 外界引用组件的时候 传递方法 父传子
- 「CTS2019」珍珠
「CTS2019」珍珠 解题思路 看了好多博客才会,问题即要求有多少种方案满足数量为奇数的变量数 \(\leq n-2m\).考虑容斥,令 \(F(k)\) 为恰好有 \(n\) 个变量数量为奇数的方 ...