支付寶小程序API 下拉刷新

2020-09-14 13:43 更新

my.startPullDownRefresh

簡介

my.startPullDownRefresh 是主動開啟下拉刷新的 API。

使用限制

  • 調(diào)用 my.startPullDownRefresh 后觸發(fā)下拉刷新動畫,效果與用戶手動下拉刷新一致(會觸發(fā) onPullDownRefresh 監(jiān)聽方法)。
  • 當(dāng)處理完數(shù)據(jù)刷新后,my.stopPullDownRefresh 可停止當(dāng)前頁面的下拉刷新。
  • my.startPullDownRefresh 不受 allowsBounceVerticalpullRefresh 參數(shù)影響。

掃碼體驗

下拉刷新.jpeg

示例代碼

//.js
my.startPullDownRefresh()

入?yún)?/h2>

Object 類型,屬性如下:

屬性 類型 必填 描述
success Function 接口調(diào)用成功的回調(diào)函數(shù)。
fail Function 接口調(diào)用失敗的回調(diào)函數(shù)。
complete Function 接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會執(zhí)行)。

my.stopPullDownRefresh

簡介

my.stopPullDownRefresh 是停止當(dāng)前頁面的下拉刷新的 API。

使用限制

  • 調(diào)用 my.startPullDownRefresh后觸發(fā)下拉刷新動畫,效果與用戶手動下拉刷新一致(會觸發(fā) onPullDownRefresh 監(jiān)聽方法)。
  • 當(dāng)處理完數(shù)據(jù)刷新后,my.stopPullDownRefresh 可停止當(dāng)前頁面的下拉刷新。

掃碼體驗

下拉刷新.jpeg

示例代碼

// 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())
      }
    })
  }
});

入?yún)?/h4>

Object 類型,屬性如下:

屬性 類型 必填 描述
success Function 接口調(diào)用成功的回調(diào)函數(shù)。
fail Function 接口調(diào)用失敗的回調(diào)函數(shù)。
complete Function 接口調(diào)用結(jié)束的回調(diào)函數(shù)(調(diào)用成功、失敗都會執(zhí)行)。

onPullDownRefresh

簡介

onPullDownRefresh 是用于在 Page 中自定義 onPullDownRefresh 函數(shù),可以監(jiān)聽該頁面的下拉刷新事件的 API。

使用限制

  • 需要在 app.json 的 window 選項中配置 "allowsBounceVertical":"YES",在頁面對應(yīng)的 .json 配置文件中配置 "pullRefresh":true 選項,才可開啟頁面下拉刷新事件。
  • 調(diào)用 my.startPullDownRefresh 后觸發(fā)下拉刷新動畫,效果與用戶手動下拉刷新一致(會觸發(fā) onPullDownRefresh 監(jiān)聽方法)。
  • 當(dāng)處理完數(shù)據(jù)刷新后,my.stopPullDownRefresh 可停止當(dāng)前頁面的下拉刷新。

掃碼體驗

下拉刷新.jpeg

示例代碼

// 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())
      }
    })
  }
});

入?yún)?/h4>
屬性 類型 必填 描述
pullRefresh Boolean 是否允許下拉刷新。默認 true。說明:下拉刷新生效的前提是 allowsBounceVertical 值為 YES 。
allowsBounceVertical String 頁面是否支持縱向拽拉超出實際內(nèi)容。默認 YES,支持 YES/NO。

以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號