swiper动态加载数据后无法滑动问题。触摸屏无法滑动问题

出现原因:由于swiper在初始化的时候会扫描swiper-wrapper下面的swiper-slide的个数,从而完成初始化,但是由于动态加载时在初始化之后的动作,所以导致无法滑动。

解决方式:在动态获取数据之后再初始化。另外需要加入如下两个配置参数。

    var mySwiper = new Swiper ('.swiper-container', {
         observer:true,//修改swiper自己或子元素时,自动初始化swiper
         observeParents:true,//修改swiper的父元素时,自动初始化swiper
         loop: true, // 循环模式选项
         pagination: {
             el: '.swiper-pagination',
         }
     })

另外,项目需要发布在导览机上使用,结果部署之后发现在导览机上无法滑动。经过一番抓头发现是swiper版本号问题。开始用的swiper4.0.5无法滑动。修改为swiper5.3.6可以滑动。

  • 5
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值