react 中如如何實現上拉加載事件


文檔上卷的距離+窗口的高度=文檔的距離 就可以說到底了 但是我們往往在還未到低時候就開始加載下一頁

//添加窗口滾動事件
    window.onscroll = () => {
      //上卷距離 
      let st = document.documentElement.scrollTop || document.body.scrollTop;
      //窗口高度
      let wh = document.documentElement.clientHeight;
      //文檔高度
      let dh = document.documentElement.offsetHeight;
      if(st+wh+50>=dh&&this.isRequst){//到底了
        this.isRequst=false;
        console.log("到底了");
        this.n++;
        let times=this.getTime(this.n)
        //發請求 
        axios({url:"/api/4/stories/before/"+times.reqTime}).then(res=>{
          this.setState({
            list:[
              ...this.state.list,
              {
                time:times.showTime,
                data:res.data.stories
              }
            ]
          },()=>{
            this.isRequst=true
            console.log(this.state.list);
          })
        })
      }
    }
  }

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM