返回顶部vue、监听页面滚动（整理）

<template>
<div class="crestBox pointer" @click="crestCick()" v-if="isVisable == true">
	返回
</div>
</template>
<script>
export default{
	data() {
		return {
			isVisable: false,	//控制隐藏按钮
		};
	},
	created() {
		//添加滚动监听事件
		//在窗口滚动时调用监听窗口滚动方法
		window.addEventListener('scroll', this.windowScrollListener);
	},
	destroyed() {
		//离开页面时删除该监听
		window.removeEventListener('scroll', this.windowScrollListener)
	},
	//监听窗口滚动
	windowScrollListener() {
		//获取操作元素最顶端到页面顶端的垂直距离
		var scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
		if (scrollTop >= 1500) {
			this.isVisable = true; //大于1500时显示元素
		}
		if (scrollTop < 1500) {
			this.isVisable = false; //小于1500时隐藏元素
		}
	},
	crestCick() {
		//让页面滚动回到顶部
		window.scrollTo({
			top: 0,
			behavior: 'smooth'
		})
	},
}
</script>