分类： 滚动

ScrollViewContext.scrollTo(Object object)

基础库 2.14.4 开始支持，低版本需做兼容处理。

微信小程序插件：支持

微信 Windows 版：支持

微信 Mac 版：支持

功能描述

滚动至指定位置

参数

Object object

属性 类型 默认值 必填 说明
top number 否 顶部距离
left number 否 左边界距离
velocity number 否 初始速度 (webview 仅在 iOS 下生效；skyline 在 3.14.3 后支持)
duration number 否 滚动动画时长 (webview 仅在 iOS 下生效；skyline 在 3.14.3 后支持)
animated boolean 否 是否启用滚动动画

ScrollViewContext.scrollIntoView(string selector, object ScrollIntoViewOptions)

基础库 2.14.4 开始支持，低版本需做兼容处理。

微信小程序插件：支持

微信 Windows 版：支持

微信 Mac 版：支持

功能描述

滚动至指定位置

参数

string selector

元素选择器

object ScrollIntoViewOptions

基础库 3.1.0 开始支持，低版本需做兼容处理。

配置项，仅 Skyine 模式支持

属性 类型 默认值 必填 说明
offset number 0 否 跳转到目标节点时的额外偏移
withinExtent boolean false 否 只跳转到 cacheExtent 以内的目标节点，性能更佳
alignment string “start” 否 指定目标节点在视口内的位置
animated boolean true 否 是否启用滚动动画

ScrollViewContext

基础库 2.14.4 开始支持，低版本需做兼容处理。

增强微信小程序中的 ScrollView 实例，可通过 wx.createSelectorQuery 的 NodesRef.node 方法获取。 仅在 scroll-view 组件开启 enhanced 属性后生效。

属性

boolean scrollEnabled

滚动开关

boolean bounces

设置滚动边界弹性 (仅在 iOS 下生效)

boolean showScrollbar

设置是否显示滚动条

boolean pagingEnabled

分页滑动开关

boolean fastDeceleration

设置滚动减速速率 (仅在 iOS 下生效)

boolean decelerationDisabled

取消滚动惯性 (仅在 iOS 下生效)

方法

ScrollViewContext.triggerRefresh(Object object)

触发下拉刷新。

ScrollViewContext.closeRefresh()

关闭下拉刷新。

ScrollViewContext.triggerTwoLevel(Object object)

触发下拉二级。

ScrollViewContext.closeTwoLevel(Object object)

关闭下拉二级。

ScrollViewContext.scrollTo(Object object)

滚动至指定位置

ScrollViewContext.scrollIntoView(string selector, object ScrollIntoViewOptions)

滚动至指定位置

示例代码

wx.createSelectorQuery()
  .select('#scrollview')
  .node()
  .exec((res) => {
    const scrollView = res[0].node;
    scrollView.scrollEnabled = false;
  })

wx.pageScrollTo(Object object)

基础库 1.4.0 开始支持，低版本需做兼容处理。

以 Promise 风格 调用：支持

需要页面权限：当前是插件页面时，宿主微信小程序不能调用该接口，反之亦然

微信小程序插件：支持，需要微信小程序基础库版本不低于 2.1.0

在微信小程序插件中使用时，只能在当前插件的页面中调用

微信 Windows 版：支持

微信 Mac 版：支持

微信 鸿蒙 OS 版：支持

功能描述

将页面滚动到目标位置，支持选择器和滚动距离两种方式定位

参数

Object object

属性 类型 默认值 必填 说明 最低版本
scrollTop number 否 滚动到页面的目标位置，单位 px
duration number 300 否 滚动动画的时长，单位 ms
selector string 否 选择器 2.7.3
offsetTop number 否 偏移距离，需要和 selector 参数搭配使用，可以滚动到 selector 加偏移距离的位置，单位 px 2.23.1
success function 否 接口调用成功的回调函数
fail function 否 接口调用失败的回调函数
complete function 否 接口调用结束的回调函数（调用成功、失败都会执行）

selector 语法

selector类似于 CSS 的选择器，但仅支持下列语法。

  • ID选择器：#the-id
  • class选择器（可以连续指定多个）：.a-class.another-class
  • 子元素选择器：.the-parent > .the-child
  • 后代选择器：.the-ancestor .the-descendant
  • 跨自定义组件的后代选择器：.the-ancestor >>> .the-descendant
  • 多选择器的并集：#a-node, .some-other-nodes

示例代码

wx.pageScrollTo({
  scrollTop: 0,
  duration: 300
})