React-实现上拉加载更多

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