实现小程序下拉刷新的监听启动与停止-移动开发平台 mPaaS-阿里云

onPullDownRefresh

说明：mPaaS 10.1.32 及以上版本支持该接口。

在 Page 中自定义 onPullDownRefresh 函数，可以监听该页面用户的下拉刷新事件。

需要在 app.json 的 window 选项中配置 "allowsBounceVertical":"YES"，在页面对应的 .json 配置文件中配置 "pullRefresh":true 选项，才可开启页面下拉刷新事件。
调用 my.startPullDownRefresh 后触发下拉刷新动画，效果与用户手动下拉刷新一致（会触发 onPullDownRefresh 监听方法）。
当处理完数据刷新后，my.stopPullDownRefresh 可停止当前页面的下拉刷新。

入参

属性	类型	必填	描述
pullRefresh	Boolean	否	是否允许下拉刷新。默认为 true。备注：下拉刷新生效的前提是 `allowsBounceVertical` 的值为 YES。
allowsBounceVertical	String	否	页面是否支持纵向拽拉超出实际内容。默认为 YES, 支持 YES / NO。

代码示例

onPullDownRefresh 代码示例如下：

// API-DEMO page/API/pull-down-refresh/pull-down-refresh.json
{
    "defaultTitle": "下拉刷新",
    "pullRefresh": true
}

<!-- API-DEMO page/API/pull-down-refresh/pull-down-refresh.axml-->
<view class="page">
  <view class="page-section">
    <view class="page-section-title">下滑页面即可刷新</view>
    <view class="page-section-btns">
      <view type="primary" onTap="stopPullDownRefresh">停止刷新</view>
    </view>
  </view>
</view>

// API-DEMO page/API/pull-down-refresh/pull-down-refresh.js
Page({
  onPullDownRefresh() {
    console.log('onPullDownRefresh', new Date());
  },
  stopPullDownRefresh() {
    my.stopPullDownRefresh({
      complete(res) {
        console.log(res, new Date())
      }
    })
  }
});

my.stopPullDownRefresh

说明：mPaaS 10.1.32 及以上版本支持该接口。

停止当前页面的下拉刷新。

调用 my.startPullDownRefresh 后触发下拉刷新动画，效果与用户手动下拉刷新一致（会触发 onPullDownRefresh 监听方法）。
当处理完数据刷新后，my.stopPullDownRefresh 可停止当前页面的下拉刷新。

入参

Object 类型，属性如下：

属性	类型	必填	描述
success	Function	否	接口调用成功的回调函数。
fail	Function	否	接口调用失败的回调函数。
complete	Function	否	接口调用结束的回调函数（调用成功、失败都会执行）。

代码示例

my.stopPullDownRefresh 代码示例如下：

// API-DEMO page/API/pull-down-refresh/pull-down-refresh.json
{
    "defaultTitle": "下拉刷新",
    "pullRefresh": true
}

<!-- API-DEMO page/API/pull-down-refresh/pull-down-refresh.axml-->
<view class="page">
  <view class="page-section">
    <view class="page-section-title">下滑页面即可刷新</view>
    <view class="page-section-btns">
      <view type="primary" onTap="stopPullDownRefresh">停止刷新</view>
    </view>
  </view>
</view>

// API-DEMO page/API/pull-down-refresh/pull-down-refresh.js
Page({
  onPullDownRefresh() {
    console.log('onPullDownRefresh', new Date());
  },
  stopPullDownRefresh() {
    my.stopPullDownRefresh({
      complete(res) {
        console.log(res, new Date())
      }
    })
  }
});

my.startPullDownRefresh

说明：mPaaS 10.1.32 及以上版本支持该接口。

开始下拉刷新。

调用 my.startPullDownRefresh 后触发下拉刷新动画，效果与用户手动下拉刷新一致（会触发 onPullDownRefresh 监听方法）。
当处理完数据刷新后，my.stopPullDownRefresh 可停止当前页面的下拉刷新。
my.startPullDownRefresh 不受 allowsBounceVertical 、pullRefresh 参数影响。

入参

Object 类型，属性如下：

属性	类型	必填	描述
success	Function	否	接口调用成功的回调函数。
fail	Function	否	接口调用失败的回调函数。
complete	Function	否	接口调用结束的回调函数（调用成功、失败都会执行）。

代码示例

my.startPullDownRefresh 代码示例如下：

my.startPullDownRefresh()