h5+vue页面下滑查看更多 页面触底+页面滑动

h5页面触底，不足一屏触发滑动 超过一屏触发触底效果

解决 页面大屏正好一屏，小屏超过一屏 页面下滑查看更多 的问题

解决方法1 超过一屏监听滚动 触底触发 小于或等于一屏监听触摸 上滑触发

  data() {
    return {
      startY: 0,
      endY: 0,
      Fullscreen: true
    };
  },

添加触摸事件

	//给触摸区域添加触摸事件
  <div @touchstart="touchstart()" @touchend="touchend()"></div>
  //事件
      touchstart() {
      if (!this.Fullscreen) {
        return;  //判断 可视化的高度与溢出的距离 是否大于一屏  Fullscreen满屏
      }
      event.preventDefault(); //阻止默认事件（长按的时候出现复制）
      this.startY = event.changedTouches[0].pageY;
      console.log(this.startY);
    },
    touchend() {
      if (!this.Fullscreen) {
        return;
      }
      event.preventDefault();
      this.endY = event.changedTouches[0].pageY;
      if (this.startY - this.endY > 200) {
        console.log(this.endY);
        console.log(this.startY);
        //达到条件触发事件
        this.onscroll();
      }
    },

监听页面滚动

  mounted() {
    window.addEventListener("scroll", this.getScroll);
    
    let windowHeight =  document.documentElement.clientHeight || document.body.clientHeight; //变量windowHeight是 可视区的高度
    let scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight; //变量scrollHeight是 滚动条的总高度 /可视化的高度与溢出的距离（总高度）
    
    if (windowHeight < scrollHeight) {
      this.Fullscreen = false;//是否满屏
    }
  },
  destroyed() {
    window.removeEventListener("scroll", this.getScroll);
  },

   //监听滚动
    getScroll() {
      var scrollTop = document.documentElement.scrollTop || document.body.scrollTop; //变量scrollTop是滚动条滚动时，距离顶部的距离
      let windowHeight = document.documentElement.clientHeight || document.body.clientHeight; //变量windowHeight是 可视区的高度
      let scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight; //变量scrollHeight是 滚动条的总高度 /可视化的高度与溢出的距离（总高度）

      console.log(scrollTop, windowHeight, scrollHeight);
      //滚动条到底部的条件
      if (scrollTop + windowHeight >= scrollHeight) {
        //触发事件
      }
    }