微信小程序如何实现下拉刷新

我们在进行微信小程序的开发时，经常遇到需要上拉刷新数据的需求。可能大家都不经意间看到过，当新建一个页面的时候，原始JS文件中的生命周期函数里就有实现这个需求的函数。

但是如果直接在里面写代码的话，根本无法触发这个函数。我当时也很懵逼，但是看过微信小程序开发文档后，我们发现，需要在页面的json文件中配置一下属性enablePullDownRefresh的值为true

还有很关键的一点是，如果用onPullDownRefresh这个生命周期函数的话，就必须要写wx.stopPullDownRefresh来关掉它，不然它会一直处于下拉的状态。

  onPullDownRefresh: function () {
    wx.showToast({
      title: '下拉加载',
    })
    wx.stopPullDownRefresh({
      success: (res) => {
        
      },
    })
  },

我们来测试一下代码的效果

这个操作还是很实用的，大部分情况下，我们都是在onLoad请求并处理数据的，所以可以在监听下拉的这个函数里重新调用一次onLoad函数，以此来重新请求一遍数据，达到刷新页面的作用。

有什么问题可以联系QQ：505417246

关注下面微信公众号，可以领取微信小程序、Vue、TypeScript、前端、uni-app、全栈、Nodejs、Python等实战学习资料