Vue vue-awesome-swiper 的坑

1、在vertical的場景模式下，默認的高度很奇怪，非常非常的大。完全沒有規律。后來使用autoHeight好了一點。但依然有問題，問題在於它會根據swiper-slide內元素的高度自動變化疊加。依然會非常非常大。最后才知道。手動設置height即可解決。由於我的場景是fullpage頁面，所以只需要設置height : window.innerHeight 即可。完整代碼如下：

swiperOption: {
          direction : 'vertical', height : window.innerHeight, onTransitionStart: function (swiper){ this.isHideIcon = swiper.activeIndex <= 3; }.bind(this) }

 

2、在拖拽的過程中，我還發現另一個bug。有時候拖拽邊緣。會導致沒有很好的彈性滾動，而是像普通頁面一樣滑動導致錯誤了。后來檢查才發現，是因為你手勢滑動的區域不是<swiper>元素覆蓋的范圍導致的。解決方案很簡單，整個頁面都讓swiper覆蓋即可。保證用戶觸碰的是swiper元素本身，而不是body、或者其他div元素