小程序将页面滚动到目标位置wx.pageScrollTo

wx.pageScrollTo(Object object)

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

参数

Object object

属性类型默认值必填说明最低版本
scrollTopnumber滚动到页面的目标位置,单位 px
durationnumber300滚动动画的时长,单位 ms
selectorstring选择器2.7.3
offsetTopnumber偏移距离,需要和 selector 参数搭配使用,可以滚动到 selector 加偏移距离的位置,单位 px2.23.1
successfunction接口调用成功的回调函数
failfunction接口调用失败的回调函数
completefunction接口调用结束的回调函数(调用成功、失败都会执行)

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
})

分类小程序界面UI相关推荐:

小程序显示消息提示框wx.showToast 小程序显示模态对话框 小程序显示 loading 提示框wx.showLoading 小程序底部弹窗wx.showActionSheet 小程序隐藏消息提示框wx.hideToast 小程序隐藏 loading 提示框wx.hideLoading 小程序返回对话框wx.enableAlertBeforeUnload 关闭小程序页面返回询问对话框wx.disableAlertBeforeUnload 小程序显示导航条加载动画wx.showNavigationBarLoading 小程序动态设置当前页面的标题wx.setNavigationBarTitle 小程序设置页面导航条颜色wx.setNavigationBarColor 小程序隐藏导航条加载动画wx.hideNavigationBarLoading 小程序隐藏返回首页按钮wx.hideHomeButton 小程序动态设置下拉背景字体、loading 图的样式wx.setBackgroundTextStyle 小程序动态设置窗口的背景色wx.setBackgroundColor 小程序tabBar右上角显示红点wx.showTabBarRedDot 小程序显示 tabBar wx.showTabBar 小程序动态设置 tabBar 的整体样式wx.setTabBarStyle 小程序动态设置 tabBar 某一项的内容wx.setTabBarItem 小程序tabBar右上角添加文本wx.setTabBarBadge 小程序移除 tabBar右上角的文本wx.removeTabBarBadge 小程序隐藏 tabBar的右上角的红点wx.hideTabBarRedDot 小程序隐藏 tabBar wx.hideTabBar 小程序动态加载网络字体 小程序停止当前页面下拉刷新wx.stopPullDownRefresh 小程序开始下拉刷新 小程序将页面滚动到目标位置wx.pageScrollTo 小程序增强 ScrollView 实例ScrollViewContext 小程序动态设置置顶栏文字内容wx.setTopBarText 小程序延迟执行wx.nextTick 小程序获取菜单按钮的布局位置wx.getMenuButtonBoundingClientRect 小程序设置窗口大小wx.setWindowSize 小程序监听窗口尺寸变化事件wx.onWindowResize 小程序取消监听窗口尺寸变化事件wx.offWindowResize