l***@ruigantek.com
- 发布：2023-03-09 16:13
- 更新：2023-03-09 16:13
- 阅读：316
产品分类： 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>
</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>
</swipe>
预期结果：
预期 点击tab0 直接点击 tab2选项卡时 监听swiper onchange获取index值 不会重复打印获取值得问题 应该只会打印一次值
预期 点击tab0 直接点击 tab2选项卡时 监听swiper onchange获取index值 不会重复打印获取值得问题 应该只会打印一次值
实际结果：
预期 点击tab0 直接点击 tab2选项卡时 监听swiper onchange获取index值 先打印出 index =2 紧接打印出 index=1 index=2值 重复打印获取值得问题
预期 点击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抖动情况
