小程序之缓存

每个微信小程序都可以有自己的本地缓存，可以通过 wx.setStorage（wx.setStorageSync）、wx.getStorage（wx.getStorageSync）、wx.clearStorage（wx.clearStorageSync）可以对本地缓存进行设置、获取和清理。同一个微信用户，同一个小程序 storage 上限为 10MB。localStorage 以用户维度隔离，同一台设备上，A 用户无法读取到 B 用户的数据。

1.设置缓存

2.获取缓存

3.清除缓存

在微信小程序中，数据缓存其实就和localstorage 的原理差不多，所以理解起来并不难。下面我们来一起实现一下。

效果图展示：

我们在index页面存入数字11，然后在跳转到新页面，在将缓存中的11取出渲染到当前页面。具体代码如下：

index页面：

<span style="font-size:24px">

<view class="btn-area">

<navigator url="../navigator/navigator?title=我是navi">跳转到新的页面post情求</navigator>

<navigator url="../redirect/redirect?title=我是red" redirect>跳转到当前页面</navigator>

</view>

</span>

<view>

<input style="border:2rpx solid red" placeholder="输入信息" bindinput="getInput" />

<button style="border:2rpx solid yellow" bindtap="saveInput">存入</button>

</view>1234567891012345678910

index的js：

//index.js

//获取应用实例

var app = getApp()

Page({

data: {

storage:''

},

onLoad: function () {

var that = this

//获取输入值

getInput:function(e){

this.setData({

storage:e.detail.value

})

},

//存储输入值

saveInput:function(){

wx.setStorageSync('storage', this.data.storage)

}

})

12345678910111213141516171819202122231234567891011121314151617181920212223

跳转页面：

<view>从存储中得到的数据:{{storage}}</view>11

跳转页面的js：

var app = getApp()

var that

Page( {

data: {

storage:''

},

onLoad: function(options) {

that = this

//获取存储信息

wx.getStorage({

key: 'storage',

success: function(res){

// success

that.setData({

storage:res.data

})

}

})

}

})

try {

wx.setStorageSync("key", "value")

} catch (e) {

}1234

具体使用方法例如，如果是游戏的话获取当前登录用户的昵称，即为key，而他所获得分数为value

获取所存数的缓存（同步）

try { var value = wx.getStorageSync("key") //console.log(value)

if (value) { // Do something with return value

that.setData({

scor:value

})

}

} catch (e) { // Do something when catch error

}

---