小程序如何实现既支持上拉加载更多内容，又支持下拉刷新功能？

本文共计429个文字，预计阅读时间需要2分钟。

首先说下遇到的问题1、如何触发下拉刷新、下拉刷新如何实现以及如何设置下拉刷新的距离2、在wx.startPullDownRefresh()中如何执行方法3、没有刷新动画4、iOS真机下下拉刷新反+

先说下遇到的问题1、怎么触发下拉刷新上拉加载及设定触发上拉加载的距离2、怎么在wx.startPullDownRefresh（）中执行方法3、没有刷新动画4、ios真机下拉刷新反

先说下遇到的问题 1、怎么触发下拉刷新上拉加载及设定触发上拉加载的距离 2、怎么在wx.startPullDownRefresh（）中执行方法 3、没有刷新动画 4、ios真机下拉刷新反弹距离过大

一、要触发下拉刷新上拉加载事件，需要能够监听到事件才行 在需要实现下拉刷新上拉加载的页面配置xxx.json文件

{ "enablePullDownRefresh":true,//是否开启下拉刷新 "backgroundTextStyle":"dark",//下拉背景字体、loading 图的样式，仅支持 dark/light，默认light不可见 "onReachBottomDistance": 50//页面上拉触底事件触发时距页面底部距离，单位为px}

js文件定义监听事件 在 Page 中定义 onPullDownRefresh 处理函数，监听该页面用户下拉刷新事件 onReachBottom监听页面上拉触底事件的处理函数

Page({ onLoad () { }, onPullDownRefresh(){ //doing some thing 下拉刷新执行完毕要停止当前页面下拉刷新 //setTimeout(function(){ //wx.stopPullDownRefresh() //},1000) }, onReachBottom(){ //wx.showToast({ //title: 'onReachBottom', //icon: 'none', //duration: 600 //}); }});

二、怎么在wx.startPullDownRefresh()中执行方法

wx.startPullDownRefresh({ success:function(){ // doing some thing }, fail: function() { // doing some thing }})

三、没有刷新动画 json文件中设置”backgroundTextStyle”:”dark”，显示刷新动画 四、ios真机下拉刷新反弹距离过大 下拉刷新中使用wx.showToast等交互反馈，会导致反弹距离过大