1、使用JS原生的监听事件监听用户的滑动状态
js:
listentouch() {
var startX, startY;
document.addEventListener(
"touchstart",
function(ev) {
startX = ev.touches[0].pageX;
startY = ev.touches[0].pageY;
},
false
);
const that = this;
document.addEventListener(
"touchmove",
function(ev) {
var endX, endY;
endX = ev.changedTouches[0].pageX;
endY = ev.changedTouches[0].pageY;
var direction = that.GetSlideDirection(startX, startY, endX, endY);
switch (direction) {
case 0:
console.log("无操作");
break;
case 1:
// 向上
that.changeAgain = false;
break;
case 2:
// 向下
that.changeAgain = true;
break;
}
},
false
);
},
GetSlideDirection方式:针对用户的滑动数据进行封装
GetSlideDirection(startX, startY, endX, endY) {
var dy = startY - endY;
var result = 0;
if (dy > 0) {
//向上滑动
result = 1;
} else if (dy < 0) {
//向下滑动
result = 2;
} else {
result = 0;
}
return result;
},