vue 2.x 监听div垂直滚动条到最底部

vue 2.x 监听div垂直滚动条到最底部_第1张图片

mounted(){
    window.addEventListener('scroll',this.handleScroll,true);
},
methods: {
    handleScroll(e){
        //变量scrollTop是滚动条滚动时,距离顶部的距离
        var scrollTop = e.target.scrollTop;
        //变量windowHeight是可视区的高度
        var windowHeight = e.target.clientHeight;
        //变量scrollHeight是滚动条的总高度
   		var scrollHeight = e.target.scrollHeight;
        //滚动条到底部的条件
        if(scrollTop+windowHeight==scrollHeight){
            //写后台加载数据的函数
         	console.log("距顶部"+scrollTop+"可视区高度"+windowHeight+"滚动条总高度"+scrollHeight);
            alert("距顶部"+scrollTop+"可视区高度"+windowHeight+"滚动条总高度"+scrollHeight);
        }
    }
}

 

你可能感兴趣的:(Vue)