如此代码:
methods里面
getSpecialData() {
// const params = {
// page: this.pagenum
// };
// console.log(params);
orderslist(this.pagenum).then(res => {
if (this.pagenum == 1) {
// this.datacounts = res.count;
// this.newsTop = res.data.topnew;
} else {
let aaa = res.data.records
// aaa.forEach(item =>{
// item.pic=item.pic.split(',')
// })
this.shopbox = this.shopbox.concat(aaa)
console.log(this.shopbox);
this.scroll = true;
}
this.pagenum = this.pagenum+1;
console.log(this.pagenum);
});
},
handleScroll () { //滚动事件监听处理
//是否滚动到底部的判断
let scrolltop =
document.documentElement.scrollTop ||
document.body.scrollTop ||
window.pageYOffset;
if (
(scrolltop + document.documentElement.clientHeight ==
document.documentElement.scrollHeight) &
this.scroll
) {
if (this.pagenum > this.totalnum) {
//如果大于总页数停止请求数据
// this.nomore = 1;
this.nomore =true
this.$toast("已全部加载完成")
} else {
this.getSpecialData();
this.nomore =false
}
}
}
//销毁函数里面
destroyed() {
window.removeEventListener("scroll", this.handleScroll, false);
}
//最后在此调用
created() {
window.addEventListener("scroll", this.handleScroll);
},
//添加文字描述
<p class="morelp">
{{ nomore ? "没有更多了" : "正在加载..." }}
</p>
即可实现下拉刷新下页的内容
如此即可