【报Bug】scroll-view标签 scroll-left动态设置位置时 scroll-view标签内容水平位置抖动

分类：uni-app

bug反馈

产品分类： uniapp/H5

PC开发环境操作系统： Windows

PC开发环境操作系统版本号： win11

HBuilderX类型：正式

HBuilderX版本号： 4.45

浏览器平台： Chrome

浏览器版本： 133.0.6943.60（正式版本64 位）

项目创建方式： HBuilderX

示例代码：

html
<view>
<scroll-view class="scroll-view_H" scroll-x="true" :scroll-left="scrollLeft" scroll-with-animation :show-scrollbar="false">
<view class="scroll-view-item_H UEl_0">煤矿概况</view>
<view class="scroll-view-item_H UEl_1">人员车辆</view>
<view class="scroll-view-item_H UEl_2">系统监控</view>
<view class="scroll-view-item_H UEl_3">原煤生产</view>
<view class="scroll-view-item_H UEl_4">土石剥离</view>
</scroll-view>
</view>
<swiper class="swiper-box" :current="swiperCurrent" @transition="transition" @animationfinish="animationfinish">
<swiper-item class="swiper-item">testpage1</swiper-item>
<swiper-item class="swiper-item">testpage1</swiper-item>
<swiper-item class="swiper-item">testpage1</swiper-item>
<swiper-item class="swiper-item">testpage1</swiper-item>
<swiper-item class="swiper-item">testpage1</swiper-item>
</swiper>

js
animationfinish({ detail: { current } }) {
this.scrollLeft=351;
}

css
.scroll-view-item_H {
display: inline-block;
height: 80rpx;
line-height: 80rpx;
text-align: center;
font-size: 36rpx;
padding: 0px 10px;
}
.scroll-view_H {
white-space: nowrap;
width: 100%;
}

当scroll-view标签下的子标签宽度超出scroll-view标签的宽度通过scroll-view标签的scroll-left实现动态设置水平移动的时候 scroll-view子标签会跳动

2025-03-14 11:01 负责人:无分享

套马杆的套子 - 没有解决不了的问题，只有解决不完的问题

估计你这个值，scroll-left，不准确吧，不知道你那宽度是不是都一样，或者，你也可以用uni.createSelectorQuery()动态的获取每个标签的宽度，
也可以scroll-into-view 替代 scroll-left试试

4***@qq.com (作者)

找到原因了是因为当滑动的时候swiper-view生成的标签<div class="uni-scroll-view" style="overflow: auto hidden;"></div> overflow有一瞬间被改成hidden然后又变成auto hidden 当是hidden的时候文字水平位置变高产生抖动跳跃的感觉不知道这个咋给禁掉

2025-03-28 09:45

要回复问题请先登录或注册