微信小程序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
}