获取滚动条距离底部的距离

在项目中经常需要监听页面滚动条滚到底部，下面来总结一下：

1.在微信小程序中

可以使用bindscrolltolower这个事件

 bindscrolltolower: function () {
   //到底后要做的事情
    },

2.vue里面

先在mounted里面添加监听滚动条事件scrollBottom

   mounted() {
      window.addEventListener('scroll', this.scrollBottom)
    },

然后在scrollBottom里定义一些内容

  scrollBottom() {
        // 变量scrollTop为当前页面的滚动条纵坐标位置
        let scrollTop =
          document.documentElement.scrollTop || document.body.scrollTop;
        // 变量 windowHeight 是可视区的高度
        let windowHeight =
          document.documentElement.clientHeight || document.body.clientHeight;
        // 变量 scrollHeight 是滚动条的总高度
        let scrollHeight =
          document.documentElement.scrollHeight || document.body.scrollHeight;


		// 到底的条件
        if (
          scrollTop + windowHeight == scrollHeight
        ) {
		//到底后要进行的操作
        }
      }

document.documentElement和document.body的区别
documentElement 对应的是 html 标签，body 对应的是 body 标签，
在w3c标准下，document.body.scrollTop是恒为0的，需要用document.documentElement.scrollTop来代替，所以需要进行一下判断。

可以到底后对分页数据进行请求

	//pageIndex 当前请求的数据页码，初始为0
	//totalPage 总页数
   if (this.pageIndex < this.totalPage - 1) {
            this.pageIndex += 1
            this.getList() //请求数据
          }

如果要防止多次触发。可以加个布尔值，初始为true，触发事件后设置为false，根据数据请求情况再还原为true。