小程序下拉刷新

wxml代码

<view class="box">
  <block wx:for="{{ hot }}" wx:key="unique">
    <view class="book_box">
      <view><image src="https://www.zichen.shop{{ item.goods_logo}}"></image>
      </view>
      <view>{{ item.goods_name }}</view>
      <view class="box1">{{ item.goods_price }}</view>
    </view>
  </block>
</view>

wxss代码

.box{
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
.book_box{
  width: 375rpx;
  height: 600rpx;
}
image{
  width: 300rpx;
  height: 300rpx;
}

js代码

Page({
  /**
   * 页面的初始数据
   */
  data: {
    hot:[] , 
    page:1,
    limit:6,
    keyword:'',
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
      this._gethot(this.data.page,this.data.limit)
  },
  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
       this._gethot(this.data.page+1,this.data.limit)
  },
  _gethot(page,limit,keyword=''){
      wx.request({
        url: 'http://www.zichen.shop/adminapi/goods?page=' + page
        + '&limit=' + limit + '&keyword=' +keyword,
        method:"GET",
        success:(res)=>{
           let hot = res.data.data.data;
           let old = this.data.hot;
           let new_hot = old.concat(hot);
           this.setData({
             'hot' : new_hot,
             page : page,
           })

        }
      })
  },
  bindKeyInput: function (e) {
    //获取输入框的值
    let keyword = e.detail.value;
    //调用分页方法
       //请求接口
       wx.request({
        url: 'http://www.zichen.shop/adminapi/goods?page=1'+ '&limit=' + 6 + '&keyword=' + keyword, //仅为示例，并非真实的接口地址
        method: 'GET',
        success: (res) => {
          //分页新请求的数据
          let hot = res.data.data.data;
          this.setData({
            hot
          })
        }
      })
  },
})