圖片發(fā)自簡書App
微信小程序中<swiper>組件可以實現(xiàn)圖片輪播凰浮，非常之方便叁怪。
wxml代碼
效果圖
其中interval屬性是圖片輪播時間，duration屬性是圖片切換效果的時間
除此之外野揪，swiper還能實現(xiàn)頂部導(dǎo)航欄效果楣富，也就是頁面輪播凿掂，當(dāng)然要實現(xiàn)導(dǎo)航欄效果就沒必要設(shè)置輪播啦，手動點擊切換頁面或者滑動切換頁面均可菩彬。
導(dǎo)航欄頁面輪播代碼
效果圖
那么問題來了缠劝，<swiper>的高度要怎么設(shè)置才能滿足我們的需求呢，如果不設(shè)置的話骗灶，<swiper>的高度默認(rèn)為頁面的大概三分之一惨恭，也就是圖片輪播的效果
不設(shè)置頁面高度
設(shè)置height為100%呢，他只顯示手機頁面的高度耙旦，如果內(nèi)容超過這個高度就顯示不了了
最下面一個只顯示到一半
解決辦法就是
將你所需顯示的內(nèi)容全部放到一個<view>里面脱羡，通過后臺去獲取這個<view>的高度，然后再將頁面高度設(shè)置為獲取到的高度就可以啦免都。
圖片發(fā)自簡書App
其中.noPay為這個<view>的class名锉罐。
以上內(nèi)容為個人見解，如有誤導(dǎo)绕娘，請與本人聯(lián)系脓规，謝謝，與你一起成長险领。
