tt.startPullDownRefresh 1.0.0+

基础库 1.0.0 开始支持。

下拉刷新,小程序会主动触发下拉刷新动画,直到调用 tt.stopPullDownRefresh 成功后停止,调用该方法与用户手动触发下拉刷新效果一致。

语法

tt.startPullDownRefresh([options])

参数说明

options 为 object 类型,属性如下:

属性名类型默认值必填说明最低支持版本
successfunction接口调用成功的回调函数1.0.0
failfunction接口调用失败的回调函数1.0.0
completefunction接口调用结束的回调函数(调用成功、失败都会执行)1.0.0

回调成功

Object 类型,属性如下:

属性类型说明最低支持版本
errMsgstring"startPullDownRefresh:ok"1.0.0

回调失败

Object 类型,属性如下:

属性类型说明最低支持版本
errMsgstring"startPullDownRefresh:fail "+详细错误信息1.0.0

效果示例

扫码体验

请使用字节宿主APP扫码

代码示例

开发者工具中预览

【代码示例 1】:无参数示例

预期表现:正常触发/停止页面刷新。

<!-- index.ttml -->
<button bindtap="startPullDownRefresh">点击触发页面下拉刷新(无参)</button>
<button bindtap="stopPullDownRefresh">点击停止页面下拉刷新(无参)</button>
// index.js
Page({
  startPullDownRefresh() {
    tt.startPullDownRefresh();
  },
  stopPullDownRefresh() {
    tt.stopPullDownRefresh();
  },
});
// index.json
{
  "enablePullDownRefresh": true
}

【代码示例 2】:有参数示例

预期表现:正常触发/停止页面刷新,并给出成功或失败提示。

<!-- index.ttml -->
<button bindtap="startPullDownRefresh">点击触发页面下拉刷新</button>
<button bindtap="stopPullDownRefresh">点击停止页面下拉刷新</button>
// index.js
Page({
  startPullDownRefresh() {
    tt.startPullDownRefresh({
      success: function (res) {
        tt.showToast({ title: "页面开始刷新" });
      },
      fail: function (err) {
        tt.showModal({
          title: "页面刷新失败",
          content: err.errMsg,
          showCancel: false,
        });
      },
      complete: function (res) {
        console.log(`stopPullDownRefresh调用完成`);
      },
    });
  },
  stopPullDownRefresh() {
    tt.stopPullDownRefresh({
      success: function (res) {
        tt.showToast({ title: "页面停止刷新" });
      },
      fail: function (err) {
        tt.showModal({
          title: "停止刷新失败",
          content: err.errMsg,
          showCancel: false,
        });
      },
      complete: function (res) {
        console.log(`stopPullDownRefresh调用完成`);
      },
    });
  },
});
// index.json
{
  "enablePullDownRefresh": true
}

Bug & Tip

  • Tip:只有在页面的page.json中配置了enablePullDownRefresh: true才能够开启下拉刷新,可参考代码示例
  • Tip:直到调用 tt.stopPullDownRefresh 成功后才会停止刷新,否则一直刷新。
点击纠错
评价此篇文档