微信小程序缓存

wx.setStorageSync(“key”, “value”);
wx.getStorageSync(“key”);

/* 
    0 web中的本地存储和 小程序中的本地存储的区别
      1 写代码的方式不一样了 
        web: localStorage.setItem("key","value") localStorage.getItem("key")
    小程序中: wx.setStorageSync("key", "value"); wx.getStorageSync("key");
      2:存的时候 有没有做类型转换
        web: 不管存入的是什么类型的数据,最终都会先调用以下 toString(),把数据变成了字符串 再存入进去
      小程序: 不存在 类型转换的这个操作 存什么类似的数据进去,获取的时候就是什么类型
    1 先判断一下本地存储中有没有旧的数据
      {time:Date.now(),data:[...]}
    2 没有旧数据 直接发送新请求 
    3 有旧的数据 同时 旧的数据也没有过期 就使用 本地存储中的旧数据即可
     */

/**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {

   //  1 获取本地存储中的数据  (小程序中也是存在本地存储 技术)
   const Cates = wx.getStorageSync("cates");
   // 2 判断
   if (!Cates) {
     // 不存在  发送请求获取数据
     this.getCate();
   } else {
     // 有旧的数据 定义过期时间  10s 改成 5分钟
     if (Date.now() - Cates.time > 1000 * 10) {
       // 重新发送请求
       this.getCate();
     } else {
       // 可以使用旧的数据
       this.Cates = Cates.data;
       let leftMenuList = this.Cates.map(v => v.cat_name);
       let rightContent = this.Cates[0].children;
       this.setData({
         leftMenuList,
         rightContent
       })
     }
   }
  },

  
  //获取分类数据
  getCate() {
    request({url: "https://api-hmugo-web.itheima.net/api/public/v1/categories"}).then(
      result => {
        console.log(result)
        this.cates = result
         // 把接口的数据存入到本地存储中
         wx.setStorageSync("cates", { time: Date.now(), data: this.cates });
        //构造左侧的大菜单数据
        let leftMenuList = this.cates.map(v => v.cat_name);
        // 构造右侧的商品数据
        let rightContent = this.cates[0].children;
        this.setData({
          leftMenuList,
          rightContent
         })
       
      }
    )

  },

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值