html代码 这里样式就忽略吧 只是一个简单的上箭头图标 这里记得绑定点击事件
<div @click="backTop"> <i class="iconfont icon-shangjiantou"></i> <p>顶部</p> </div>在methods中写上回到顶部的方法
// 点击图片回到顶部方法,加计时器是为了过渡顺滑 backTop () { const that = this; document.documentElement.scrollTop = document.body.scrollTop = that.scrollTop -4000; }, // 为了计算距离顶部的高度,当高度大于60显示回顶部图标,小于60则隐藏 scrollToTop () { const that = this let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop that.scrollTop = scrollTop if (that.scrollTop > 60) { that.btnFlag = true } else { that.btnFlag = false } },