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元素

转载于:https://www.cnblogs.com/CyLee/p/8425169.html