Yiusing
Yiusing
  • 发布:2019-08-22 14:39
  • 更新:2019-09-10 11:44
  • 阅读:1959

【报Bug】swiper组件,带选项卡的单列表左右滑动

分类:uni-app

详细问题描述

仿照hello uni-app中的顶部选项卡做的带选项卡的单列表左右滑动,其中我在列表中使用了input组件,当在第二页输入input后点击其他地方,swiper会自动切换回第一页。通过swiper的change事件打印event可以看到莫名其妙触发了两次事件,第一次的e.detail是空对象,第二次的e.detail中的source是空字符串。

使用hello uni-app中的顶部选项卡模板添加input后也会出现这种情况,请问是什么导致swiper触发了两次,使tabIndex混乱?

[期望]

仅在touch滑动或点击选项卡时才滑动swiper,而不是input输入完后点击其他不会改变tabIndex的地方而滑动。

[平台]
H5端

DEMO在附件中

若用官方hello模板,在swiper中添加input输入框,输入后点击其他地方会报错,而且错误是出在onChange事件里,若onChange事件里面只对index处理,则会使swiper自动滑动至第一页。

2019-08-22 14:39 负责人:无 分享
已邀请:

最佳回复

DCloud_UNI_GSQ

DCloud_UNI_GSQ

bug 已修复,更新 HBuilderX 2.2.5.20190907-alpha 即可
其他版本的临时解决方案:input 组件增加 @change.stop

<input @change.stop type="text" value="" placeholder="12312"/>
DCloud_UNI_GSQ

DCloud_UNI_GSQ

提供一下测试工程

  • Yiusing (作者)

    附件已添加,麻烦排查一下原因,谢谢


    2019-08-27 10:42

  • DCloud_UNI_GSQ

    回复 Yiusing: 测试未复现,你是在哪端出现此问题?


    2019-08-27 15:09

  • Yiusing (作者)

    回复 DCloud_UNI_GSQ: H5端,因为swiper 的 onChagne事件绑定的changeTab函数中有处理数据,所以测试的时候输入input后点击其他地方只会报错,不会自动滑动,你可以把tabbar.vue文件中changeTab函数里面的 148行-172行注释掉再测试,会发现input输入后再点击其他地方会自动滑动,实际错误的地方在于swiper的onchange事件被无故触发


    2019-08-28 09:22

该问题目前已经被锁定, 无法添加新回复