鍍金池/ 問(wèn)答/HTML/ swiper3的循環(huán)滾動(dòng)時(shí),第一張圖片不能完全展現(xiàn)

swiper3的循環(huán)滾動(dòng)時(shí),第一張圖片不能完全展現(xiàn)

html:

<div class="swiper-container">
    <div class="swiper-wrapper">
                
    </div>
    <!-- 分頁(yè)器 -->
    <div class="swiper-pagination"></div>
</div>

里面的內(nèi)容是從后臺(tái)拿的數(shù)據(jù)動(dòng)態(tài)加載的

js :

window.onload=function () {
        var mySwiper = new Swiper('.swiper-container', {
            //direction: 'vertical',
            loop: true,
            autoplay: 2000,
            autoplayDisableOnInteraction: false,
            // 如果需要分頁(yè)器
            pagination: '.swiper-pagination',
            paginationClickable:true,
            observer:true,//修改swiper自己或子元素時(shí),自動(dòng)初始化swiper
            observeParents:true,//修改swiper的父元素時(shí),自動(dòng)初始化swiper
        })
    }

出現(xiàn)的問(wèn)題是:第一張圖片總是一閃而過(guò),不能完全展現(xiàn)出來(lái)就到了第二張圖片,頁(yè)面在app中出現(xiàn)的問(wèn)題

回答
編輯回答
墨小白

swiper在后臺(tái)數(shù)據(jù)沒(méi)有回來(lái)已經(jīng)初始化了,swiper-slide 循環(huán) data ,加上這個(gè) v-if=“data.length”,獲取數(shù)據(jù)了之后再渲染

2018年3月23日 07:38