GululuQ-mp/pages/index/index.js

// index.js
const { API } = require('../../service/api.js');

const App = getApp();


Page({
  data: {
    bannerList: [],
    ipInfoList: [],
    prodClassList: [],
    showAddCartModal: false,
    currentProduct: null,
    isCategoryMini: false
  },
  // 显示商品属性模态框
  showAddCartModal(e) {
    const product = e.detail;
    this.setData({
      showAddCartModal: true,
      currentProduct:product
    });
  },
  // 关闭商品属性模态框
  handleCloseAddCartModal() {
    this.setData({ showAddCartModal: false });
  },

  // 进入今日热门页
  hotBut: function(){
    wx.navigateTo({
      url: '../Mall/hotCommodity/hotCommodity',
    })
  },
  // 进入新品上市页
  newBut: function(){
    wx.navigateTo({
      url: '../Mall/newCommodity/newCommodity',
    })
  },
  // 进入预售页
  presaleBut: function(){
    wx.navigateTo({
      url: '../Mall/presaleCommodity/presaleCommodity',
    })
  },

  onLoad: async function (options) {

    // 生命周期函数--监听页面加载
    console.log("onLoad");
    console.log('App.globalData', App.globalData);

    // const resBanner = await API.getBanners({});
    // console.log('resBanner', resBanner);
    // this.setData({
    //   bannerList : resBanner.bannerList
    // });

    // const resBrand = await API.getIpInfos({});
    // console.log('resBrand', resBrand);
    // this.setData({
    //   ipInfoList : resBrand.ipInfoList
    // });
    // const resCategory = await API.getProdClasses({});
    // console.log('resCategory', resCategory);
    // this.setData({
    //   prodClassList : resCategory.prodClassList
    // });
    this.setData({
        prodClassList: [
          { classUrl: 'someprod.jpg', title: '火影忍者' },
          { classUrl: 'someprod.jpg', title: '初音' },
          { classUrl: 'someprod.jpg', title: '原神' },
          { classUrl: 'someprod.jpg', title: '柯南' },
          { classUrl: 'someprod.jpg', title: '非人哉' },
          { classUrl: 'someprod.jpg', title: '全部' },
        ]
      });
  },

  onPageScroll: function(e) {
    wx.createSelectorQuery()
      .select('.brand-bar')
      .boundingClientRect((rect) => {
        if (rect) {
          const shouldBeMini = rect.top <= 40; // 在brand-bar进入顶部时，category切换为mini模式
          if (this.data.isCategoryMini !== shouldBeMini) {
            this.setData({
              isCategoryMini: shouldBeMini
            });
          }
        }
      })
      .exec();
  }
  
})