支付寶小程序API 滾動

2020-09-14 15:28 更新

my.pageScrollTo

簡介

my.pageScrollTo 是滾動到頁面的目標(biāo)位置的 API。

使用限制

  • scrollTop 的優(yōu)先級比 selector 高。
  • 使用 my.pageScrollTo 跳轉(zhuǎn)小程序頂部時,必須將 scrollTop 值設(shè)為大于 0,方可實(shí)現(xiàn)跳轉(zhuǎn)。

掃碼體驗(yàn)

滾動.jpeg

示例代碼

<!-- API-DEMO page/API/page-scroll-to/page-scroll-to.axml-->
<view class="page">
  <view class="page-description">頁面滾動 API</view>


  <view class="page-section">
    <view class="page-section-title">
      my.pageScrollTo
    </view>
    <view class="page-section-demo">
      <input type="text" placeholder="key" name="key" value="{{scrollTop}}" onInput="scrollTopChange"></input>
    </view>
    <view class="page-section-btns">
      <view onTap="scrollTo">頁面滾動</view>
    </view>
  </view>


  <view style="height:1000px"/>
</view>
// API-DEMO page/API/page-scroll-to/page-scroll-to.js
Page({
  data: {
    scrollTop: 0,
  },
  scrollTopChange(e) {
    this.setData({
      scrollTop: e.detail.value,
    });
  },
  onPageScroll({ scrollTop }) {
    console.log('onPageScroll', scrollTop);
  },
  scrollTo() {
    my.pageScrollTo({
      scrollTop: parseInt(this.data.scrollTop),
            duration: 300,
    });
  },
});

入?yún)?/h4>

為 Object 類型,屬性如下:

屬性 類型 必填 描述
scrollTop Number 滾動到頁面的目標(biāo)位置,單位為 px。使用 my.pageScrollTo 跳轉(zhuǎn)小程序頂部時,必須將 scrollTop 值設(shè)為大于 0,方可實(shí)現(xiàn)跳轉(zhuǎn)。
duration Number 滾動動畫的時長,單位為 ms(毫秒)。默認(rèn)值為 0。基礎(chǔ)庫 1.20.0 或更高版本開始支持。
selector String 選擇器?;A(chǔ)庫 1.20.0 或更高版本開始支持。
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í)行)。

selector 語法

當(dāng)傳入 selector 參數(shù),框架會執(zhí)行 document.querySelector(selector) 以選取目標(biāo)節(jié)點(diǎn)。

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

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號