• 微信号:wumiao_357234902

微信小程序swiper禁止滑动,不影响页面解决办法

作者:Miao 阅读:7305次

微信小程序中 swiper 组件禁止上下滑动,这个实现起来比较简单,该组件的 swiper-item 里面上下滑动会执行函数 catchtouchmove,直接可以通过控制这个函数来实现:

<swiper class="myswiper">
    <swiper-item catchtouchmove="stopTouchMove"><swiper-item></swiper-item>
</swiper>
stopTouchMove: function () {
    return false;
}

此方法可以阻止 swiper 滑动,但是会导致页面不能滑动,解决方法:

<swiper class="myswiper">
    <swiper-item catchtouchmove="stopTouchMove"><swiper-item></swiper-item>
</swiper>
.myswiper {
    position: relative;
}
.myswiper::after {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
}

本站部分文章、数据、素材收集于网络,所有版权均归源网站或原作者所有!

如果侵犯了您的权益,请来信告知我们下线删除,邮箱:357234902@qq.com