swiper动态添加数据后执行不正常(接口数据)

在接口回调成功后添加定时及部分参数,解决轮播模块不自动刷新,不能无限循环

setTimeout(()=>{
              var swiper = new Swiper('.swiper-container', {
              slidesPerView: 3,
              spaceBetween: 0,
              initialSlide :1, 
              autoplay: true,
              centeredSlides: true,
              slidesOffsetBefore : -25,
              loop: true,
              observer:true,
              observeParents:true,
              autoplay: {
                disableOnInteraction: false, //手动滑动之后不打断播放
                delay: 2000
              },
              // spaceBetween : 20, //轮播图之间的距离
              onSlideChangeEnd: function(swiper){ 
               swiper.update();  
                  swiper.startAutoplay();
                swiper.reLoop();  
              },
              pagination: {
                el: '.swiper-pagination',
                clickable: true,
              },
              navigation: {
                  nextEl: ".swiper-button-next",
                  prevEl: ".swiper-button-prev",
                },
            });
          },0)
      for (var i=0; i<data.length+6; i++) {		
        console.log(data[i].url)	
				$('#swiid').append(`<div class="swiper-slide">
                              <img src="${img}" class="lbtimg" alt="">
                              <img src="img/img.png" alt="" class="botimg">
                            </div>`);
			}

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值