小程序getStorageSync、setStorageSync数据缓存,优化页面加载

1、将数据缓存到本地

同步缓存:wx.setStorageSync()

异步缓存:wx.setStorage()

2、从本地缓存获取数据:

同步:wx.getStorageSync()

异步:wx.getStorage()

 

onLoad(options) {
    // 获取本地数据
    const Cates = wx.getStorageSync('cates');
    if (!Cates) {
      this.getCates();
    } else {
      // 定义数据过期时间10s
      if(Date.now() - Cates.time > 1000*10) {
        this.getCates();
      } else {
        this.Cates = Cates.data;
        // 重新渲染数据
        let leftMenuList = this.Cates.map(Cates => Cates.cat_name);
        this.setData({
          leftMenuList
        })
        
      }
    }
  },
    /**
   * 获取分类数据
   */
  async getCates() {
    const result = await request({ url: '/categories' });
    this.Cates = result;
    // 数据缓存
    wx.setStorageSync('cates', { time: Date.now(), data: this.Cates });
    // 渲染数据
    let leftMenuList = this.Cates.map(Cates => Cates.cat_name);
    this.setData({
      leftMenuList
    })
  },

 

 

你可能感兴趣的:(Vue,小程序,前端,javascript)