1. 程式人生 > >關於Tab切換中嵌套Swiper移動端滑動插件,導致Swiper插件失效的問題

關於Tab切換中嵌套Swiper移動端滑動插件,導致Swiper插件失效的問題

解決 ima true 屬性 tab切換 解決辦法 observe 嵌套 bubuko

Swiper插件大家都知道的,手機端頁面開發過程中,輪播用這個插件灰常方便的!關鍵是調用簡單,大大的提高了開發的效率;

但是在Tab切換中調用,Swiper插件就會出問題,失效了,布局結構如下圖:

技術分享圖片技術分享圖片

解決辦法:

技術分享圖片

調用的時候加入observer:true,observeParents:true這兩個屬性值就完美解決了;

這個是啟動動態檢查器(OB/觀眾/觀看者),當改變swiper的樣式(例如隱藏/顯示)或者修改swiper的子元素時,自動初始化swiper。

關於Tab切換中嵌套Swiper移動端滑動插件,導致Swiper插件失效的問題