下拉加载更多 防抖处理（react 封装防抖函数）

** 关于防抖 
Q : 什么是防抖
A : 触发事件后在x秒内函数只能执行一次，如果在x秒内又触发了该事件，就会重新开始计时

Q : 为什么要用防抖？
A : 当前的场景是用户下拉触底加载更多数据，不可能在用户滑动过程中满足条件了就是请求后台数据 ， 这样会对后台造成压力， 也会出现一些冗余数据 。

Q : 效果
A : 用户在下拉满足触底加载更多条件时   ，x秒内没有再次触发，才会加载更多数据

话不多说   ，看代码~~

​
this.state = {
    timer : null //用state保存计时器的状态 ， 也可以把timer理解成一个全局变量
}

//页面加载完成时添加屏幕滚动事件
componentDidMount(){
      window.onscroll = this.bindScroll
}


//离开当前页面时移除事件
componentWillUnmount(){
    window.onscroll = null;
  }


//滚动函数
bindScroll(){
    let clientHeight = document.documentElement.clientHeight; //视口的高度
    let scrollHeight = document.documentElement.scrollHeight; //文档的高度
    let scrollTop = document.documentElement.scrollTop || document.body.scrollTop; 

      let func = ()=>{
        if(scrollTop > scrollHeight -  clientHeight -30){//滚动到距离页面底部30px内触发
           this.getData()//获取数据