收藏
回答

swiper左右抖动问题

框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
小程序 Bug swiper 客户端 7.0.4 2.7.0
<swiper  class='swiper-box' bindchange="swiperChange" wx:if="{{listData.style.template_style == 2}}" class='lunbo' autoplay='{{true}}' interval='{{interval}}' indicator-dots='{{listData.style.indicator == "style2"?true:false}}' circular="{{true}}" indicator-color="rgba(131,145,165,0.4)" indicator-active-color="#8391a5" style='height:{{lunboHeight}};padding:0 {{listData.style.pmargin}}px;'>
      <swiper-item class="swiper-item {{img_angle}}" wx:for="{{listData.data}}" wx:key="{{index}}" wx:for-item="item">
        <view class='swiper-img image-item {{img_style}} {{img_angle}}' bindtap="gotoBannerDetail" data-url="{{item.link_addr}}" style="background-image:url({{item.imgurl}});background-size:{{listData.style.fill}};">
          <image class='swiper-img-item' bindload='changeHeight' mode='widthFix' style='width:100%;' src='{{item.imgurl}}'></image>
          <view class='swiper-text {{text_angle}}' wx:if="{{item.name != ''}}">{{item.name}}</view>
        </view>
      </swiper-item>
    </swiper>
    <view wx:if="{{listData.style.indicator == 'style1' && listData.style.template_style == 2}}" class="dots" style='padding:0 {{listData.style.pmargin}}px;'>
      <block wx:for="{{listData.data}}" wx:for-index="dotIndex" wx:key="{{dotIndex}}">
        <view class="dot {{dotIndex == swiperCurrent?'actives':''}}"></view>
      </block>
    </view>

- 当前 Bug 的表现(可附上截图)

手机端一开始进去页面轮播正常,退出来再进去就一直左右抖动,我这边的指示器是自定义的,所以不管用户是否操作都要改current,已经有人提过这个问题了,但没有得到具体的解决办法,是只要判断那个source就行了吗,touch和autoplay都要操作current


- 预期表现

轮播正常,不抖动


- 复现路径


- 提供一个最简复现 Demo


回答关注问题邀请回答
收藏

4 个回答

  • SnowRock
    SnowRock
    2019-09-20

    求同

    2019-09-20
    有用
    回复
  • 郭洪伟
    郭洪伟
    2019-09-11

    我是这么解决的:

    bindHousePicSwipperItemChg(e) {

    var now = new Date().getTime();

    var total = now - this.data.lastSwipperItemChgTime

    if (total >= 3000) /*interval="3000"*/{

    this.setData({

    housePicSwipperCurIndex: e.detail.current,

    lastSwipperItemChgTime: now,

    })

    }

    },


    2019-09-11
    有用
    回复 1
    • 韩先生
      韩先生
      2019-09-23
      这种有效吗
      2019-09-23
      回复
  • 是小白啊
    是小白啊
    2019-05-21

    麻烦提供出现问题的具体机型、微信版本号、系统版本号,以及能复现问题的代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)

    2019-05-21
    有用
    回复 8
    查看更多(3)
  • 目光
    目光
    2019-05-21


    还有别的手机,也一样,开发版本我自己测没问题,提交体验版就出现问题了,关键是不是每次都会复现

    2019-05-21
    有用
    回复 2
    • 十安
      十安
      2019-05-28

      你好,这个问题解决了吗,碰到相同的问题了

      2019-05-28
      回复
    • 目光
      目光
      2019-05-28回复十安

      没有,我指示器改原生的了

      2019-05-28
      回复
登录 后发表内容