前言
本地緩存是指微信小程序存儲(chǔ)在當(dāng)前設(shè)備空間里地?cái)?shù)據(jù)劈狐。在官方文檔說明中罐孝,其所有的數(shù)據(jù)存儲(chǔ)上限為10MB即單個(gè)小程序的存儲(chǔ)空間上限為10MB。==在使用過程中用戶使用本地緩存可以存儲(chǔ)一些非重要性的生產(chǎn)操作肥缔,例如讓小程序再次打開能快速渲染頁面莲兢,減少用戶等待時(shí)間。
快速上手
小程序提供了讀寫刪本地緩存的方法:
- wx.setStorageSync/wx.setStorage 寫數(shù)據(jù)到本地緩存
- wx.removeStorageSync/wx.removeStorage 根據(jù)key移除本地緩存
- wx.getStorageSync/wx.getStorage 根據(jù)key獲取指定緩存
- wx.clearStorageSync/wx.clearStorage 清除本地緩存
其中Sync結(jié)尾的表示同步接口
關(guān)于同步緩存和異步緩存的區(qū)別
異步與同步的區(qū)別是续膳,異步不會(huì)阻塞當(dāng)前任務(wù)改艇,同步緩存直到同步方法處理完才能繼續(xù)往下執(zhí)行。
寫入本地緩存
//異步接口
wx.setStorage({
key: 'key1',
data: 'value1',
success:function(){
console.log("寫入value1成功坟岔!")
},fail:function(){
console.log("寫入value1失斍菜!!")
}
})
//同步接口 只有1執(zhí)行成功才會(huì)執(zhí)行2或3
try{
wx.setStorageSync("key", "value2") //1
console.log("寫入value2成功炮车!") //2
}catch(e){
console.log("寫入value2失敹姹洹!") //3
}
根據(jù)key讀取本地緩存
//異步接口
wx.getStorage({
key: 'key1',
success: function (res) {
// 異步接口在success回調(diào)才能拿到返回值
var value1 = res.data
},
fail: function () {
console.log('讀取key1失敗')
}
})
//同步接口
try {
// 同步接口立即返回值
var value2 = wx.getStorageSync('key2')
} catch (e) {
console.log('讀取key2失敗')
}
根據(jù)key移除本地緩存
//異步接口
wx.removeStorage({
key: 'key1',
success(res) {
console.log("key為key1的緩存清除成功瘦穆!")
},fail:function(){
console.log("key為key1的緩存清除失敿拖丁!")
}
})
//同步接口
try {
wx.removeStorageSync('key2')
console.log("key值為2的緩存清除成功扛或!")
} catch (e) {
console.log("key值為2的緩存清除失斆嘣邸!")
}
清除本地所有緩存
//異步接口
wx.clearStorage()
//同步接口
try {
wx.clearStorageSync()
console.log("清除本地所有緩存成功N跬谩悲伶!")
} catch (e) {
console.log("清除本地所有緩存失敗住涉!")
}
最后麸锉,還要注意的一點(diǎn)是如果寫入了同樣key的緩存數(shù)據(jù),后寫的會(huì)覆蓋了前者舆声,因此需要我們注意一下