touch事件实现左右滑动,如何禁止大于1个手指?
发布于 5 年前 作者 jing14 7532 次浏览 来自 官方Issues

刚刚接触小程序,还不是很了解事件的相关特性, 麻烦大佬们指点一下。

关于touch实现左右滑动切换页面,多个手指触碰屏幕后再一个手指滑动屏幕卡顿或者失效的问题怎么解决。

view 绑定了touchStart 和 touchEnd

方法写在了touchEnd里面的。

  /**
   * 触摸开始事件
   */
  touchStart: function(event) {
    touchDot = event.touches.pageX; // 获取触摸时的原点// 使用js计时器记录时间    
    interval = setInterval(function() {
      time++;
    }, 100);
  },

  /**
   * 触摸结束事件
   */
  touchEnd: function(event) {
    let touchMove = event.changedTouches.pageX;
    // 向左滑动   if (touchMove - touchDot <= -100 && time < 10) {if (!this.data.first) {
        this.onPrevious()
      }
    }
    // 向右滑动   if (touchMove - touchDot >= 100 && time < 10) {if (!this.data.latest) {
        this.onNext()
      }
    }
    clearInterval(interval); // 清除setIntervaltime = ;
  },

实际效果,单个手指滑动没有问题,但当用户多个手指触碰屏幕滑动后,可以实现切换,滑动完成再一个手指滑动的时候没有有效果,或者要滑动N次才触发一次。

1 回复

弄个代码片段吧

回到顶部