j***@126.com
j***@126.com
  • 发布:2020-05-22 15:18
  • 更新:2020-05-26 15:08
  • 阅读:1461

【报Bug】关于onPageScroll在app端使用的bug

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Mac

PC开发环境操作系统版本号: 10.15.2

HBuilderX类型: 正式

HBuilderX版本号: 2.7.5

手机系统: Android

手机系统版本号: Android 9.0

手机厂商: 华为

手机机型: MRD-AL00

页面类型: vue

打包方式: 云端

项目创建方式: HBuilderX

示例代码:
const pages = getCurrentPages();  
const page = pages[pages.length - 1] || {};  
page.onPageScroll = function(){  
    console.log('滚动中..')  
}

操作步骤:

直接在新建页面的onLoad方法中执行示例代码即可复现

预期结果:

APP和微信小程序表现一样,上述代码可以正常执行onPageScroll方法

实际结果:

APP端执行示例代码,onPageScroll不会执行,微信小程序可以

bug描述:

const pages = getCurrentPages();  
const page = pages[pages.length - 1] || {};  
page.onPageScroll = function(){  
    console.log('滚动中..')  
}

上述代码在app中无法执行,page能够正常获取,但是onPageScroll不会执行,页面滚动时不会打印“滚动中..”;
微信小程序端上述代码运行正常,页面滚动时会打印“滚动中..”;
像vant中的sticky组件就是用的这种写法,所以在app中不能正常使用vant的sticky组件,麻烦给看看这个问题

2020-05-22 15:18 负责人:DCloud_UNI_GSQ 分享
已邀请:
j***@126.com

j***@126.com (作者)

官方有看到嘛,劳烦回复下啊

DCloud_heavensoft

DCloud_heavensoft

这个bug我们会看。
但吸顶不应该使用onPageScroll ,这种监听的效率极低,在逻辑层和视图层来回通信。去插件市场搜吸顶,找个正经解决方案。nvue和vue都有

  • j***@126.com (作者)

    嗯,不仅是吸顶的问题,主要是这种写法的支持,因为发现这个和微信小程序不一样的地方后,会有一些担心其他支持小程序的SDK也不能拿来就用,,

    2020-05-22 18:20

DCloud_UNI_GSQ

DCloud_UNI_GSQ

后续会考虑支持
跨端临时解决方案:

  1. 在页面中加一个空的 onPageScroll 监听(为了优化性能,如果页面上没有 onPageScroll 生命周期不会监听)
  2. 组件中的 page.onPageScroll = fn 修改为:page.$vm.$options.onPageScroll[0] = fn或者page.$vm.$options.onPageScroll.push(fn)
            const pages = getCurrentPages();  
            const page = pages[pages.length - 1] || {};  
            const fn = function() {  
                console.log('滚动中..')  
            }  
            // page.onPageScroll = fn  
            // page.$vm.$options.onPageScroll[0] = fn  
            page.$vm.$options.onPageScroll.push(fn)  
  • 日月月

    后续会考虑支持大概是什么时候。这个也算是一个高频功能。

    2022-06-14 19:08

该问题目前已经被锁定, 无法添加新回复