1. 写在前面
我最开始纠结当用户滑动时onTouchMove事件会不停的执行去调接口,于是我侥幸的想只用onTouchEnd事件去判
断用户是否滑到最底部,但是这种方法应用到项目中才发现点击的时候也会触发onTouchEnd,实际应用并不理想。
光判断滑到最底部是不够的,首先需要知道用户现在的操作,是点击还是滑动(向上、向下、向左、向右),这里
受到了[原生js判断手指滑动方向][1]的启发。
2. demo
class demo Component {
constructor(props) {
super(props);
this.state = {
finished: false,//是否全部加载完毕
isFoot: true, //阻止用户频繁上拉调接口
}
this._page = 1; //分页页码
this.val = ''; //搜索框的值
this._page_size = 5; //每页显示个数
this.startx; //触摸起始点x轴坐标
this.starty; //触摸起始点y轴坐标
}
//接触屏幕
touchStart(e) {
this.startx = e.touches[0].pageX;
this.starty = e.touches[0].pageY;
}
//离开屏幕([e.changedTouches][2])
touchEnd(e) {
let endx, endy;
endx = e.changedTouches[0].pageX;
endy = e.changedTouches[0].pageY;
let direction = this.getDirect