uni-app uni.pageScrollTo 在ios环境下tabbar页面隐藏时滚动无效（隐藏并非卸载 只是当前显示其他tabbar页面时候）

uni-app uni.pageScrollTo 在ios环境下tabbar页面隐藏时滚动无效（隐藏并非卸载 只是当前显示其他tabbar页面时候）

开发环境 版本号 项目创建方式
Windows win11 HBuilderX

产品分类：
uniapp/App

PC开发环境操作系统：
Windows

HBuilderX类型：
正式

HBuilderX版本号：
3.3.11

手机系统：
iOS

手机系统版本号：
iOS 15

手机厂商：
苹果

手机机型：
12

页面类型：
vue

vue版本：
vue2

打包方式：
云端

App下载地址或H5网址：
https://itunes.apple.com/cn/app/id1616499044

操作步骤：

首先在tabbar 页面下 index页面打开了 监听登录之后滚动到顶部 登录成功之后进入了个人中心页面 个人中心也是tabbar页面 超过倒计时设置的1秒中再回到index页面 滚动无效 如果早于定时器时间 滚动有效

预期结果：

预期 tabbar 页面只要没关闭 应该执行滚动操作 而不是必须显示当前页面才滚动 tabbar页面始终是没有卸载的

实际结果：

实际再隐藏tabbar页面的时候没有滚动 但是pageScrollTo回调是成功的

bug描述：

setTimeout(() => {  
  uni.pageScrollTo({  
    scrollTop: 10,  
    duration: 0,  
    success: () => {  
      this.showOldMask = true  
    }  
  })  
}, 1000)

更多关于uni-app uni.pageScrollTo 在ios环境下tabbar页面隐藏时滚动无效（隐藏并非卸载 只是当前显示其他tabbar页面时候）的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

请提供录屏（上传附件）看下，安卓表现如何？

更多关于uni-app uni.pageScrollTo 在ios环境下tabbar页面隐藏时滚动无效（隐藏并非卸载 只是当前显示其他tabbar页面时候）的实战教程也可以访问 https://www.itying.com/category-93-b0.html


在 uni-app 中使用 uni.pageScrollTo 方法时，如果在 iOS 环境下，当前页面是 TabBar 页面且该页面被隐藏（即切换到其他 TabBar 页面），可能会导致 uni.pageScrollTo 滚动无效的问题。这是因为在 iOS 环境下，当页面被隐藏时，页面的渲染可能会被暂停，导致滚动操作无法生效。

解决方案

  1. 确保页面处于激活状态： 在调用 uni.pageScrollTo 之前，确保目标页面处于激活状态。可以通过监听 TabBar 切换事件，在页面重新显示时再执行滚动操作。

  2. 延迟执行滚动： 在页面重新显示后，稍微延迟一下再执行 uni.pageScrollTo，以确保页面已经完全渲染。

  3. 使用 onShow 生命周期： 在页面的 onShow 生命周期中执行滚动操作，确保页面在显示时进行滚动。

示例代码

export default {
  onShow() {
    // 在页面显示时执行滚动操作
    setTimeout(() => {
      uni.pageScrollTo({
        scrollTop: 0, // 滚动到顶部
        duration: 300 // 滚动动画时长
      });
    }, 100); // 延迟 100ms 确保页面渲染完成
  }
}
回到顶部