例图如下:
下面代码是基本复制直用的,好评哦
这两个生命周期函数用来监听页面当前像素和顶部
mounted() {
window.addEventListener('scroll', this.scrollToTop)
},
destroyed() {
window.removeEventListener('scroll', this.scrollToTop)
},
// 下面代码是放在methods中
// 为了计算距离顶部的高度,当高度大于60显示回顶部图标,小于60则隐藏
// scrollToTop是一个点击事件,当点击是触发,就可以实现功能
scrollToTop() {
const that = this
const scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
that.scrollTop = scrollTop
if (that.scrollTop > 0) {
that.btnFlag = true
} else {
that.btnFlag = false
}
}