问题概览:
有一个小型单页应用项目,嫌用组件式调用vue-swiper麻烦,因此以CDN的方式调用swiper,结果轮播的图不动了!
爬了半天百度和谷歌都无解决方案,最后曲线救国的方式解决了问题。
解决方法:
在创建swiper时为其设置一个定时器即可解决问题!
bottleLineMove = () => { setTimeout(() => { this.bottleSwiperOne = new Swiper('#bottleLineOne', { loop: true, slidesPerView: 4, spaceBetween: 10, // centeredSlides: true, autoplay: { delay: 2000, disableOnInteraction: false, }, }) this.bottleSwiperTwo = new Swiper('#bottleLineTwo', { loop: true, slidesPerView: 4, spaceBetween: 10, // freeMode: true, autoplay: { delay: 2000, disableOnInteraction: false, }, }) }, 10) }
最后,嘻嘻!