每个微信小程序都可以有自己的本地缓存，可以通过wx . setstorage(wx . setstorageync)、wx . getstorage(wx . getstorageync)和wx . clearstorage(wx . clearstorageync)进行设置、获取和清除。同一微信用户、同一小程序的存储上限为10MB。LocalStorage由用户维度隔离。在同一台设备上，用户A无法读取用户b的数据。

数据常用于哪里？

存储可用于缓存历史记录、购物车事件等。几乎没有数据需求。存储将数据存储在本地缓存中指定的密钥中。如果是重复的，对应于密钥的内容将被覆盖。请参考微信小程序开发手册中的Storage。

如何使用异步接口进行数据缓存？

将数据存储在本地缓存中指定的密钥中，这将覆盖与该密钥对应的原始内容。这是一个异步接口。对象参数描述：

示例代码

Wx.setStorage ({key3360' key '，data3360' value'})设置Storage后，可以去开发者工具看看是否没有保存的值。

可以看出没有键值，所以当我们去输入搜索的时候

最后，入库。

获取一个带有历史密钥的数组，然后再次搜索。

看存储。

我得到了一个数组，它没有被覆盖，那么我是如何做到的呢？让我们先看看代码

search . wxmlview class=' search-top-input '输入类型=' text '占位符=' search company/position '自动聚焦='true '值=

"{{inputsearch}}" bindconfirm="search" bindinput="inputSearchTap" data-index="{{index}}"/> </view> <view class="search-history" wx:if="{{status}}"> <view class="search-history-title"> <text>历史搜索</text> <image src="../../images/delete.png" bindtap="deleteHistory"></image> </view> <view class="search-history-detail" > <view class="history-detail" wx:for="{{history}}" wx:key="{{item}}" bindtap="historySearch" data-index="{{index}}"> <text class="detail" >{{item}}</text> </view> </view> </view> search.js 设置data data: { status:false, inputsearch:'', job:[], history:[],}, 首先去获取storage中的值 onLoad: function (options) { var that =this; wx.getStorage({ key: 'history', success: function(res){ that.setData({ history:res.data, }) if(that.data.history.length==0){ that.setData({ status:false }); }else{ that.setData({ status:true }) } }, fail: function(res) { console.log(res+'aaaaa') } });}, 进行搜索和缓存数据到storage中search:function(e){var that =this;var sear =this.data.inputsearch;var jobs=this.data.job;var input = new RegExp(sear);var temp = [];if(sear == ''){ wx.showToast({ title: '请输入要搜索信息', icon:"none", duration: 1000 }); return false;}else{ this.data.history.unshift(sear);wx.setStorage({ key: 'history', data: that.data.history, success: function(res){ that.setData({ history:that.data.history, status:true }) console.log(res.data); },}) for(let i =0;i<jobs.length;i++){ if(input.test(jobs[i].job) || input.test(jobs[i].company) || input.test(jobs[i].address)){ temp.push(jobs[i]); var detail=temp; app.globalData.details=detail; } } if(temp ==''){ wx.showToast({ title: '暂无此信息', icon:"none", duration: 1000 }); this.setData({ inputsearch:'' }) }else if(temp){ wx.navigateTo({ url:'../about/about' }) this.setData({ inputsearch:'' }) } }},

将storage中的key值设为hisotry

wx.setStorage({  key: 'history',  data: that.data.history,)}

定义一个数组history空数组去获取storage中的值,首先是去查询有没有该key值，如果没有则fail，那么history依然为空数组

wx.setStorage({  key: 'history',  data: that.data.history,  success: function(res){    that.setData({      history:that.data.history,      status:true    })  },})

返回得到history之后再去将inputsearch的值添加到history中,

这里有个误区可能你会将输入的值inputsearch  push到一个新的空数组，然后再将这个新数组push到history数组中，但这个方法显然不可行，你添加之后新数组将会存放在history数组的第一个下标的数组下，对于history数组也就只有两个值

好了，回到我要说的，那么如何将inputsearch添加到history中呢,可以使用unshift方法或者push方法，这里应该使用unshift应该将每个新增值存放在history的第一个位置，这是其实就是一个用户体验问题了

var that =this;var sear =this.data.inputsearch;this.data.history.unshift(sear);wx.setStorage({    key: 'history',    data: that.data.history,      success: function(res){        that.setData({          history:that.data.history,          status:true        })        console.log(res.data);      },})