l***@ruigantek.com
l***@ruigantek.com
  • 发布:2023-03-09 16:13
  • 更新:2023-03-09 16:13
  • 阅读:396

【报Bug】uniapp nvue页面 swiper 监听onchange方法 存在偶发性重复进入多次打印

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Windows

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

HBuilderX类型: 正式

HBuilderX版本号: 3.7.3

手机系统: Android

手机系统版本号: Android 12

手机厂商: 小米

手机机型: 小米10

页面类型: nvue

vue版本: vue2

打包方式: 云端

项目创建方式: HBuilderX

示例代码:
<view class="view-tab-w"> <a-tabs :current="tabsCurrent" :tabs="tabslist" selectedSize="50" size="36" selectedColor="#191919" @changeTab="tabsChange" background="#F3F4F6" :isSlider="false"></a-tabs> </view> <swiper class="swiper-page" :current="tabsCurrent" @change="toSwiperChange"> <swiper-item class="swiper-item"> <recommendPage class="swiper-item-page" :cityName="bannerCity" :swiperList="swiperList" :imgList="imgList" totalNum="totalPageTj" :itemList="recommendList"></recommendPage> </swiper-item>
</swipe>

操作步骤:
<view class="view-tab-w"> <a-tabs :current="tabsCurrent" :tabs="tabslist" selectedSize="50" size="36" selectedColor="#191919" @changeTab="tabsChange" background="#F3F4F6" :isSlider="false"></a-tabs> </view> <swiper class="swiper-page" :current="tabsCurrent" @change="toSwiperChange"> <swiper-item class="swiper-item"> <recommendPage class="swiper-item-page" :cityName="bannerCity" :swiperList="swiperList" :imgList="imgList" totalNum="totalPageTj" :itemList="recommendList"></recommendPage> </swiper-item>
</swipe>

预期结果:

预期 点击tab0 直接点击 tab2选项卡时 监听swiper onchange获取index值 不会重复打印获取值得问题 应该只会打印一次值

实际结果:

预期 点击tab0 直接点击 tab2选项卡时 监听swiper onchange获取index值 先打印出 index =2 紧接打印出 index=1 index=2值 重复打印获取值得问题

bug描述:

nvue页面 顶部栏是自定义tab选项卡切换 底下是swiper包裹的左右布局 一共三个tab 且对应三个swiper-item布局页面
发现bug步骤:
1、点击tab选项卡切换 依次按顺序 点击tab 从0-1-2 swiper选项卡监听事件 onchange里的获取index值都是正常得
偶然问题在于:
2、我从tab0选项卡 直接点击选项卡 tab2上 通过打印swiper onchange事件 发现 打印index 会先打印出 index=2 值 然后又打印出 index=1 index=2 输出 (存在偶先情况,且发生频率挺高)
已上传附件照片日志打印

会导致页面tab0 点击tab2时 页面切换 发生tab抖动情况

2023-03-09 16:13 负责人:无 分享
已邀请:

要回复问题请先登录注册