vue 上拉加载数据

页面下面显示文字 

<tuijianlp :tuijlpList="tuijlpList" /> //组件
<p class="morelp">
	  {{ nomore ? "没有更多了" : "正在加载..." }}
</p>

js

data() {
    return {
		tuijlpList: [],
      	area_id: 3,
      	
      	datacounts: 0, //数据总条数，计算总页数
      	scroll: true,  //数据全部加载完成后为false，不再走加载事件
      	pagenum: 1, //当前页
      	totalnum: 0, //总页数
      	nomore: 0, 
    }
},
created() {
    this.getLoupanListData();
    window.addEventListener("scroll", this.handleScroll);
  },
methods: {
	getLoupanListData() {
      const params = {
        area_id: this.area_id,
        page: this.pagenum,
        category_area_id: this.category_area_id,
        price_id: this.price_id,
        is_top: this.is_top,
        searchword: this.searchword
      };
      getLoupanList(params).then(res => {
        if (this.pagenum == 1) {
          this.tuijlpList = res.data;
        } else {
          this.tuijlpList = [...this.tuijlpList, ...res.data];
          this.scroll = true;
        }
        ++this.pagenum;
        // console.log(this.tuijlpList);
      });
    },
    handleScroll() {
      //滚动事件监听处理
      //是否滚动到底部的判断
 
      if (
        (document.documentElement.scrollTop +
          document.documentElement.clientHeight ==
          document.documentElement.scrollHeight) &
        this.scroll
      ) {
        if (this.pagenum > this.totalnum) {
          //如果大于总页数停止请求数据
          this.nomore = 1;
          console.log("没有更多了");
        } else {
          this.getLoupanListData();
          this.scroll = false;
          // console.log("jiazai");
        }
      }
    }
}