回到顶部实现过程注解： 1.获取当前页面距离顶部的距离 2.计算出每次向上移动的距离，用负的滚动距离除以5，因为滚动的距离是一个正数，想向上移动就是一个减法 3.用当前距离加上计算出的距离，然后赋值给当前距离，就可以达到向上移动的效果 4.最后在移动到顶部的时候，清除定时器 vue
<div class="top" v-show="showBtn" @click="backTop">back</div>
data
showBtn: false,
mounted
mounted() {
window.addEventListener("scroll", this.showbtn, true)
},
methods
// 回到顶部
showbtn() {
let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
if (scrollTop > 1000) {
this.showBtn = true;
} else {
this.showBtn = false;
}
},
backTop() {
var timer = setInterval(function () {
let osTop = document.documentElement.scrollTop || document.body.scrollTop;
let ispeed = Math.floor(-osTop / 5);
document.documentElement.scrollTop = document.body.scrollTop = osTop + ispeed;
this.isTop = true;
if (osTop === 0) { clearInterval(timer) }
}, 80);
},
标签：body,vue,顶部,距离,点击,scrollTop,osTop,document From： https://www.cnblogs.com/CaraganaMicrophylla/p/16638088.html