z***@163.com
z***@163.com
  • 发布:2023-12-27 09:06
  • 更新:2023-12-27 09:06
  • 阅读:261

【报Bug】swiper组件及部分样式情况下的滚动功能异常

分类:HBuilderX

产品分类: HbuilderX

PC开发环境操作系统: Windows

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

HBuilderX版本号: 3.99

示例代码:

//swiper示例

<template>
<swiper class="content">
<swiper-item>
<scroll-view class="content" :scroll-y="true">
<view style="height: 50rpx;margin:5rpx;background-color: aqua;" v-for="index in 100">{{index}}</view>
</scroll-view>
</swiper-item>
</swiper>
</template>

<style>
.content {
height: 100vh;
width: 100vw;
}
</style>

// 绝对定位结合偏移的样式示例

<template>
<view class="content">
<view style="height: 50rpx;margin:5rpx;background-color: aqua;" v-for="index in 100">{{index}}</view>
</view>
</template>

<style>
.content {
height: 100vh;
width: 100vw;
overflow: scroll;
position: fixed;
top: 0;
left: 0;
transform: translateX(10rpx);
}
</style>

操作步骤:

运行到mumu模拟器或打包后在手机端测试。当页面已经滚动到顶部并且顶部边距为0时,如果按住上滑再下滑(手指不离开屏幕),页面将不会有任何滚动行为。同样地,当页面已经滚动到底部并且底部边距为0时,如果按住下滑再上滑(手指不离开屏幕),也会导致上下滑动不起作用的情况

预期结果:

当页面已经滚动到顶部并且顶部边距为0时,按住上滑再下滑(手指不离开屏幕),页面应该继续向下滚动。同样地,当页面已经滚动到底部并且底部边距为0时,按住下滑再上滑(手指不离开屏幕),页面应该继续向上滚动,正常结果应该是手指滑动时页面会相应地滚动,而不是导致滚动失效。

实际结果:

当页面已经滚动到顶部并且顶部边距为0时,如果按住上滑再下滑(手指不离开屏幕),页面将不会有任何滚动行为。同样地,当页面已经滚动到底部并且底部边距为0时,如果按住下滑再上滑(手指不离开屏幕),也会导致上下滑动不起作用的情况

bug描述:

在app端,当使用样式(position: fixed;transform: translateX(10rpx)并用)或uniapp的swiper来创建长页面时,会出现一个滚动异常的bug。具体情况如下:当页面已经滚动到顶部并且顶部边距为0时,如果按住上滑再下滑(手指不离开屏幕),页面将不会有任何滚动行为。同样地,当页面已经滚动到底部并且底部边距为0时,如果按住下滑再上滑(手指不离开屏幕),也会导致上下滑动不起作用的情况

2023-12-27 09:06 负责人:无 分享
已邀请:

要回复问题请先登录注册