通過js監聽滾動條，滾動到底部加載更多

vue 項目：

在mounted中監聽滾動事件：在離開頁面的時候取消監聽

  mounted() {
    window.addEventListener("scroll", this.handleScroll, true);
  },
 
  destroyed() {
    // 離開該頁面需要移除這個監聽的事件，不然會報錯
    window.removeEventListener("scroll", this.handleScroll);
  },

　　

 

在method中：

 

 // 保存滾動值，這是兼容的寫法
    handleScroll() {
      //變量scrollTop是滾動條滾動時，距離頂部的距離
      let that = this;
      $(".contentSecFind").scroll(function () {
        console.log("進來");
 
        let $this = $(this),
          viewH = $(this).height(), //可見高度
          contentH = $(this).get(0).scrollHeight, //內容高度
          scrollTop = $(this).scrollTop(); //滾動高度
        console.log("scrollTop:" + scrollTop);
        console.log("contentH:" + contentH);
        console.log("viewH:" + viewH);
 
        //if(contentH - viewH - scrollTop <= 100) { //到達底部100px時,加載新內容
        let diffnum = scrollTop / (contentH - viewH);
        if (diffnum >= 0.95) {
          //到達底部100px時,加載新內容
          // 這里加載數據..
 
          let itemData = that.lobbyList[that.lobbyList.length - 1];
          that.findCaseList(itemData.first_public_time);
        }
      });
    },