my.pageScrollTo
Scroll to the target position of the page.
Note:
- This interface is only supported in mPaaS 10.1.32 and later versions.
- The
scrollTop
has a higher priority thanselector
. - When
my.pageScrollTo
is used to jump to the top of the Mini Program, thescrollTop
value must be set as a number greater than 0 to make jump possible.
Parameters
Parameter | Type | Default value | Required | Description |
---|---|---|---|---|
scrollTop | Number | - | No | Scroll to the target position of the page, in px. When my.pageScrollTo is used to jump to the top of the Mini Program, the scrollTop value must be set as a number greater than 0 to make jump possible. |
duration | Number | 0 | No | Duration of scroll animation, in ms. |
selector | String | - | No | Selector |
success | Function | - | No | Callback function upon call success. |
fail | Function | - | No | Callback function upon call failure. |
complete | Function | - | No | Callback function upon call completion (to be executed upon either call success or failure). |
Syntax of selector
When the selector
parameter is passed in, the framework executes document.querySelector(selector)
to select the target node.
Code example
<!-- API-DEMO page/API/page-scroll-to/page-scroll-to.axml-->
<view class="page">
<view class="page-description">API for scrolling page</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">Scroll page</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,
});
},
});