支付宝小程序API 滚动
2020-09-14 15:28 更新
my.pageScrollTo
简介
my.pageScrollTo 是滚动到页面的目标位置的 API。
使用限制
- scrollTop 的优先级比 selector 高。
- 使用 my.pageScrollTo 跳转小程序顶部时,必须将 scrollTop 值设为大于 0,方可实现跳转。
扫码体验
示例代码
<!-- 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,
});
},
});
入参
为 Object 类型,属性如下:
属性 | 类型 | 必填 | 描述 |
---|---|---|---|
scrollTop | Number | 否 | 滚动到页面的目标位置,单位为 px。使用 my.pageScrollTo 跳转小程序顶部时,必须将 scrollTop 值设为大于 0,方可实现跳转。 |
duration | Number | 否 | 滚动动画的时长,单位为 ms(毫秒)。默认值为 0。基础库 1.20.0 或更高版本开始支持。 |
selector | String | 否 | 选择器。基础库 1.20.0 或更高版本开始支持。 |
success | Function | 否 | 接口调用成功的回调函数。 |
fail | Function | 否 | 接口调用失败的回调函数。 |
complete | Function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行)。 |
selector 语法
当传入 selector 参数,框架会执行 document.querySelector(selector) 以选取目标节点。
以上内容是否对您有帮助:
更多建议: