Write the Code. Change the World.

7月 29

小程序 swiper 组件,没有禁止手动滑动的属性。可这个功能体验很重要。该怎么实现呢。有人觉得在上边盖一层,这样虽然可以实现禁止滑动了,可和 swiper 里边的交互就不能实现了。这样也不好。还有一种方式,在 swpier-item 上增加拦截事件。

<swiper class="swiper" :duration="600" :disable-touch="false">
    <swiper-item v-for="(item, index) in menus" :key="index" catchtouchmove="catchTouchMove" @touchstart.stop="catchTouchMove" >
        <span>{{item}}</span>
    </swiper-item>
</swiper>

...

# vue methods
catchTouchMove() {
    return false;
},