回到顶部
**html **
<!-- 回到顶部 -->
<div class="go_top" @click="goTop" :class="go_top_flag == true ? 'go_top_show' :''">
<van-icon name="back-top" class="go_top_icon"></van-icon>
<span class="go_top_word">回顶部</span>
</div>
data数据
// 回到顶部 屏幕滑动值判断
go_top_flag: true,
函数
mounted() {
// 事件监听滚动条
window.addEventListener('scroll', this.watchScroll)
},
methods: {
// 回到顶部
goTop() {
document.body.scrollTop = document.documentElement.scrollTop = 0;
this.showTop = false
},
// 回到顶部 屏幕滑动值判断
watchScroll() {
var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body
.scrollTop; // 当滚动超过 100 时,回到顶部显示
if (scrollTop > 100) {
this.go_top_flag = false
} else {
this.go_top_flag = true
}
},
}
!!

浙公网安备 33010602011771号