全网整合营销服务商

营销型网站+SEO优化+关键词快排=一站式服务

免费咨询热线:15959292472

[荆门seo公司甄选久澳]微信小程序如何缓存获取数据?

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

  数据常用于哪里?

  对于数据需求较小的历史记录◆●、津市市小程序制作公司购物车事件等都可以使用 storage 进行缓存,25 2020.10 [济南seo整站优化公司]微信小程序开发容器视图的使用 view 其实就是div, 图们市小程序开发哪家好 嘿嘿嘿就是这么简单粗暴的解释。 scroll-view 可滚动视图区域●▼。 这个需要注意的是▪▲◁△, 太仓市小程序开发哪家好 昆山市小程序制[荆门seo公司甄选久澳] Storage 将数据存储在本地缓存中指定的 key 中,如果重复会覆盖掉原来该 key 对应的内容 可以参照微信小程序开发手册中的Storage

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

  将数据存储在本地缓存中指定的key中,会覆盖掉原来该key对应的内容▼○☆▷,这是一个异步接口=▲。

  OBJECT参数说明:

  示例代码

  

wx.setStorage({ key:key,
 data◇▪…★:value })

 

  当 setStorage 之后可以去到开发者工具里面查看 这是没有保存值的情况

  可以看到是没有 key 值的 那么当我们去进行输入搜索

  最后再去 storage 中查看

  获取到了一个 key 为 history 的 Array 数组 那么再去看看storage

  得到了一个数组而且没有被覆盖,那么怎么实现的呢? 先来看看js代码

  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++){< span="" style="margin•★★: 0px; padding◁…: 0px;">
 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);
 }●▪,
})

 

  好了,这样就不会出现“覆盖掉=◁…”原来的 key 值的问题了

  推荐▪□◆:《小程序开发教程》

  以上就是微信小程序如何缓存获取数据=◁-•?的详细内容,更多请关注久澳传媒编程栏目其它相关文章!

[荆门seo公司甄选久澳]微信小程序如何缓存获取数据?

您的项目需求

*请认真填写需求信息,我们会在24小时内与您取得联系。