又又又又是swiper問題

背景：

pc端專案，rem佈局，swiper作為步驟條（上一步，下一步）的功能。

發現在螢幕拖動，寬高的變化，視窗大小的變化 會引起swiper自動滑動（到下一步）。

在下載檔案連結時候回輕微引起一點點寬高的變化，導致直接滑到下一步。

Chrome瀏覽關閉底部下載內容時候也會導致滑動

思考：

1.剛開始以為是某個地方不小心多加了下一步的操作，一直在查詢

2.然後以為是下載的方法導致的，更換了多種下載方案

3.實在沒有找出，準備debugger的時候發現，螢幕變化也會引起滑動，準備查詢相關內容

行動：

但是無奈swiper的中文api太多不想一個一個的查詢，直接搜尋，篩選出以下可能有戲的內容↓

//部落格連結：https://blog.csdn.net/gengsm2/article/details/43193785//重點：通過呼叫swiper.resizeFix()方法，通知swiper需要重新計算頁面尺寸。

//部落格連結：https://blog.csdn.net/u012217533/article/details/46335075?utm_source=copy 

//重點：mySwiper.destroy(removeResizeEvent) -移除所有繫結的事件監聽（視窗的尺寸改變事件【如果removeResizeEvent的值不等於“false”】，容器（wrapper）的觸控事件，以及文件的滑鼠事件），對於新增/移除滑塊，頁面到文件時非常有用，能夠釋放瀏覽器記憶體。
 

結果：

到我正準備嘗試resize（）方式的時候，發現原來我在開始的時候就設定過，每次在初始化的時候都要翻到下一頁！啊啊啊啊，不能圖省事直接複製demo裡的程式碼呀~

 1 var mySwiper = $('.swiper-container').swiper({
 2         loop: false,
 3         simulateTouch : false,//滑鼠無效
 4         followFinger : false,//拖動後釋放滑鼠或手指時slide滑動
 5         keyboardControl : false,//設定為true時，能使用鍵盤方向鍵控制slide滑動。
 

 6         touchMoveStopPropagation : false,//阻止當和iscoll外掛一起時的a標籤跳轉的冒泡事件
 7         observer:true,//修改swiper自己或子元素時，自動初始化swiper
 8         observeParents:true,//修改swiper的父元素時，自動初始化swiper
 9         onInit: function(swiper){
10             // swiper.swipeNext()//就是這裡！！！！每次init，重繪的時候都會跳轉到下一頁
11         }
12     });

結論：

但是萬變不離其宗，如果有型別情況，排除多寫的跳轉下一步的方法，那麼肯定是在重繪，重新init swiper 容器的時候出了什麼問題，向著這個方向去找一定有結果的。

轉載註明出處，蟹蟹