uni-app vue3 + vite 在小程序环境下 onPageScroll 无效

uni-app vue3 + vite 在小程序环境下 onPageScroll 无效

5 回复

setup中的代码,是动态执行的,在小程序上,不能动态添加onPageScroll事件, 所以需要使用options方式主动定义onPageScroll之后,setup中的onPageScroll才可以正常使用 export default {
onPageScroll(){
}
}

更多关于uni-app vue3 + vite 在小程序环境下 onPageScroll 无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html


尝试了下,解决了。

回复 1***@163.com: 大佬 怎么解决的,可以贴一下代码么

能贴一下具体代码吗?这个怎么解决的

在 uni-app 的 Vue3 + Vite 环境下,onPageScroll 在小程序中失效,通常是由于以下原因及解决方案:

  1. 页面未配置 onPageScroll 选项:在 Vue3 的 setup 语法中,需使用 onPageScroll 生命周期钩子,并确保在页面组件中正确注册。示例:

    import { onPageScroll } from '[@dcloudio](/user/dcloudio)/uni-app'
    export default {
      setup() {
        onPageScroll((e) => {
          console.log('滚动距离:', e.scrollTop)
        })
      }
    }
    
  2. Vite 构建配置问题:检查 vite.config.js 中是否正确配置了 [@dcloudio](/user/dcloudio)/uni-app 插件。确保插件版本与 uni-app 版本兼容,并尝试升级到最新稳定版。

  3. 小程序页面样式限制:若页面根元素高度未撑开(如未设置 height: 100%),可能导致滚动事件无法触发。需确保页面容器可滚动:

    page { height: 100%; }
回到顶部