vue之监听页面是否以到底部

var scrollTop = document.documentElement.scrollTop||document.body.scrollTop;

var windowHeight = document.documentElement.clientHeight || document.body.clientHeight;

var scrollHeight = document.documentElement.scrollHeight||document.body.scrollHeight;

created(){
	window.onscroll = function(){
   		var scrollTop = document.documentElement.scrollTop||document.body.scrollTop;
   		var windowHeight = document.documentElement.clientHeight || document.body.clientHeight;
   		var scrollHeight = document.documentElement.scrollHeight||document.body.scrollHeight;
        
        if(scrollTop+windowHeight==scrollHeight){
           //写后台加载数据的函数
         	console.log("距顶部"+scrollTop+"可视区高度"+windowHeight+"滚动条总高度"+scrollHeight);
        }   
    }
}

mounted() {
    this.$nextTick(()=>{
        this.$refs.cont.addEventListener('scroll',this.scroll)
    })
}

scroll(e) {
            let scrollTop = e.target.scrollTop; //滑入屏幕滚动条滚动时，距离顶部的距离
            let windowHeitht = e.target.clientHeight; //能看到的页面的高度
            let scrollHeight = e.target.scrollHeight; //监控的整个div的高度（包括现在看到的和上下隐藏起来看不到的）
            let total = scrollTop + windowHeitht
            if(total == scrollHeight){
                console.log("到底了")
                //加载操作
            }else {
                console.log("还没有到底")
            } 
        }

this.$refs.cont.removeEventListener('scroll',this.scroll)

.cont {
    overflow: scroll;
    width: 100%;
    height: 677px;
}