E企盈营销工具技术服务商 热线:4006-838-530

微信小程序缓存获取数据教程

E企盈直播平台营销卖货系统

微信小程序缓存获取数据教程每个微信小程序都可以有自己的本地缓存,可以通过 wx.setStorage(wx.setStorageSync)、wx.getStorage(wx.getStorageSync)、wx.clearStorage(wx.clearStorageSync)可以对本地缓存进行设置、获取和清理。同一个微信用户,同一个小程序 storage 上限为 10MB 。localStorage 以用户维度隔离,同一台设备上,A 用户无法读取到 B 用户的数据。数据常用于哪里?对于数据需求较小的历史记录、购物车事件等都可以使用 storage 进行缓存, Storage 将数据存储在本地缓存中指定的 key 中,如果重复会覆盖掉原来该 key 对应的内容 可以参照微信小程序开发手册中的Storage如何使用异步接口进行数据缓存?将数据存储在本地缓存中指定的key中,会覆盖掉原来该key对应的内容,这是一个异步接口。OBJECT参数说明:示例代码wx.setStorage({ key:key,data:value })当 setStorage 之后可以去到开发者工具里面查看 这是没有保存值的情况可以看到是没有 key值的 那么当我们去进行输入搜索最后再去 storage中查看获取到了一个 key 为 history 的 Array数组 那么再去看看storage得到了一个数组而且没有被覆盖,那么怎么实现的呢? 先来看看js代码search.js设置datadata: {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;iif(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 值设为 hisotrywx.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);},})好了,这样就不会出现“覆盖掉”原来的 key 值的问题了相关资讯: 微信小程序   微信小程序开发教程

赞(0) 打赏
未经允许不得转载:E企盈小程序开发-热线:4006-838-530 » 微信小程序缓存获取数据教程
分享到: 更多 (0)
E企盈小程序直播营销卖货系统
E企盈直播平台营销卖货系统

评论 抢沙发

E企盈小程序开发

联系我们联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏