个人技术分享

核心：@touchstart="touchStart" @touchend="touchEnd"

代码示例：

<template>
  <view class="payPasswordSetting" @touchstart="touchStart" @touchend="touchEnd">
    
  </view>
</template>

export default {
  data () {
    return {
        touchStartX: 0,  // 触屏起始点x  
        touchStartY: 0,  // 触屏起始点y         
    }
  },

methods:{
    touchStart(e) {  
        console.log("触摸开始")  
        this.touchStartX = e.touches[0].clientX;  
        this.touchStartY = e.touches[0].clientY;  
    },  
    touchEnd(e) {  
        console.log("触摸结束")  
        let deltaX = e.changedTouches[0].clientX - this.touchStartX;  
        let deltaY = e.changedTouches[0].clientY - this.touchStartY;  
        if (Math.abs(deltaX) > 50 && Math.abs(deltaX) > Math.abs(deltaY)) {  
            if (deltaX >= 0) {  
                console.log("左滑")  
                this.leftClick()
            } else {  
                console.log("右滑")  
            }  
        } else if(Math.abs(deltaY) > 50&& Math.abs(deltaX) < Math.abs(deltaY)) {  
            if (deltaY < 0) {  
                console.log("上滑")  
            } else {  
                console.log("下滑")  
            }  
        } else {  
            console.log("可能是误触！")  
        }  
    },
    leftClick(){
        // uni.navigateTo({
        //     url: './setting'
        // })
        // 这里自己写要跳转的路径
    },