Taro中如何正确监听页面滚动事件？

一利娟提问于 2026-03-07 14:26:20 阅读 2

框架

我在Taro开发微信小程序时，想监听页面的滚动事件，但用onScroll好像没生效，文档里也没找到明确说明。试了在页面config里加enablePullDownRefresh也不行。

这是我的代码：

export default {
  onScroll(e) {
    console.log('滚动了', e.detail.scrollTop)
  },
  config: {
    navigationBarTitleText: '测试页'
  }
}

是不是Taro里监听滚动得用别的方法？比如用useReady里绑定scroll-view？但我不想额外套一层scroll-view啊……

Taro

我来解答赞 2 收藏

反馈

1 条解答

设计师洺华 Lv1

Taro里监听页面滚动确实有点坑，我之前也踩过。在微信小程序原生开发里用onScroll没问题，但Taro环境下得用onPageScroll。

你那个写法改成这样就行：

export default {

  onPageScroll(e) {

    console.log('当前滚动位置', e.scrollTop) // 注意这里参数结构不一样了

  },

  config: {

    navigationBarTitleText: '测试页'

  }

}

几个关键点：
1. 要用onPageScroll而不是onScroll，这是Taro的API命名规则
2. 参数e的结构和原生小程序不一样，直接取e.scrollTop就行
3. 不需要额外加enablePullDownRefresh配置，除非你真要下拉刷新

不用套scroll-view也能监听，不过要注意这个方法只能监听整个页面的滚动，如果只是监听某个局部区域的滚动，那还是得用scroll-view组件。

2026-03-07 15:06