前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >小程序本地存储之循环写入数组内容

小程序本地存储之循环写入数组内容

作者头像
许坏
发布2019-07-08 19:51:21
3.4K0
发布2019-07-08 19:51:21
举报
文章被收录于专栏:宅机吧
这两天在开发一个一款小程序的历史记录功能需要使用本地存储,特记此文。

wx.setstoragesync和wx.setstorage的区别

以Sync(同步,同时)结尾的都是都是同步缓存,二者的区别是,异步不会阻塞当前任务,同步缓存直到同步方法处理完才能继续往下执行。

通俗点说,异步就是不管保没保存成功,程序都会继续往下执行.同步是等保存成功了,才会执行下面的代码.

使用异步,性能会更好;而使用同步,数据会更安全

小程序官方文档:

代码语言:javascript
复制
https://developers.weixin.qq.com/miniprogram/dev/api/wx.setStorageSync.html

因为存储的是历史记录,在这里只考虑不能影响性能,所以我们全采用异步

需要存储的数据内容:

代码语言:javascript
复制
this.setData({
      data:{
        cover: "https://aweme.snssdk.com/aweme/v1/play/?video_id=v0200f620000bjbquvjbo1i9kj5oo2u0&ratio=1920&line=0"
        url: "https://aweme.snssdk.com/aweme/v1/play/?video_id=v0200f620000bjbquvjbo1i9kj5oo2u0&ratio=1920&line=0"
      }
    })

获取存储内容wx.getStorage。

首次获取,由于存储为空,wx.getStorage返回fail,进行单次存储。

代码语言:javascript
复制
 fail(res) {
//第一次打开时获取为null
      that.setData({
       list_url: {
         url: that.data.data.url,
         cover: that.data.data.url,
        }
      });
var newarr = [that.data.list_url]; //对象转为数组
var newarr =JSON.stringify(newarr);//数组转对象
      wx.setStorage({
        key: 'history',
data: newarr
      })
    }

当再次获取时,wx.getStorage返回success,此时可进行循环存储。

代码语言:javascript
复制
     success(res) {
       var oldarr = JSON.parse(res.data);
      that.setData({
        list_url: {
          url: that.data.data.url,
          cover: that.data.data.url,
        }
      });
       var newarr = [that.data.list_url]; //对象转为数组
       var newarr = newarr.concat(oldarr);//连接数组
       var newarr = JSON.stringify(newarr);//数组转对象
      wx.setStorage({
        key: 'history',
         data: newarr,
      })
    },

完整的dome演示如下:

代码语言:javascript
复制
history:function(){
 var that=this;
  wx.getStorage({
    key: 'history',
    success(res) {
       var oldarr = JSON.parse(res.data);//字符串转数组
      that.setData({
        list_url: {
          url: that.data.data.url,
          cover: that.data.data.url,
        }
      });
       var newarr = [that.data.list_url]; //对象转为数组
       var newarr = newarr.concat(oldarr);//连接数组
       var newarr = JSON.stringify(newarr);//数组转字符串
      wx.setStorage({
        key: 'history',
         data: newarr,
      })
    },
    fail(res) {
       //第一次打开时获取为null
      that.setData({
       list_url: {
         url: that.data.data.url,
         cover: that.data.data.url,
        }
      });
       var newarr = [that.data.list_url]; //对象转为数组
       var newarr =JSON.stringify(newarr);//数组转字符串
      wx.setStorage({
        key: 'history',
         data: newarr,
      })
    }
  });
}
本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2019-05-13,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 宅机吧 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
相关产品与服务
对象存储
对象存储(Cloud Object Storage,COS)是由腾讯云推出的无目录层次结构、无数据格式限制,可容纳海量数据且支持 HTTP/HTTPS 协议访问的分布式存储服务。腾讯云 COS 的存储桶空间无容量上限,无需分区管理,适用于 CDN 数据分发、数据万象处理或大数据计算与分析的数据湖等多种场景。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档