vue中添加滚动加载更多，因为是单页面所以需要在跳出页面时候销毁滚动，要不会出现错乱。我们在mounted建立滚动，destroyed销毁滚动。
我要评论 mounted () {
window.addeventlistener('scroll', this.handlescroll)
},
destroyed () {
window.removeeventlistener('scroll', this.handlescroll)
},
定义一个函数，在滚动到底部时候使滚动条距离顶部距离与可视区域高度之和等于滚动条总高度，在加载后如果列表长度为0时应该停止加载，要不会出现一直加载的情况
handlescroll () {
//变量scrolltop是滚动条滚动时，距离顶部的距离
var scrolltop = document.documentelement.scrolltop||document.body.scrolltop;
//变量windowheight是可视区的高度
var windowheight = document.documentelement.clientheight || document.body.clientheight;
//变量scrollheight是滚动条的总高度
var scrollheight = document.documentelement.scrollheight||document.body.scrollheight;
//滚动条到底部的条件
if(scrolltop+windowheight==scrollheight &&this.list.length !==0){
this.loadmore() // 加载的列表数据
}
}
如对本文有疑问， 点击进行留言回复！！
JS 浅拷贝——Shallow copy 在 Canvas 绘图中的应用
网友评论