点击回到顶部的小按钮

这玩意儿很好实现，一个<a href="#top" />就行。贴一下平滑点的样式。

<template>  
<a href="#top" class="back_top_dv"> <svg-icon name="top"></svg-icon></a>
</template>

<script>
export default { 
 name: "backTop", 
 data() {  
  return {  
    scrollTop: "",    
};  
}, 
mounted() {   
    window.addEventListener("scroll", this.handleScroll, true);
  },  
methods: {  
  handleScroll() { 
    this.scrollTop =        
    document.documentElement.scrollTop || document.body.scrollTop; 
     if (this.scrollTop > 1000) {  
      document.querySelector(".back_top_dv").classList.add("showBtn");
      } else {      
        document.querySelector(".back_top_dv").classList.remove("showBtn");  
    }  
  }, 
 },
};
</script>
<style lang="scss" scoped>
.back_top_dv { 
 position: fixed;  
 right: 20px; 
 bottom: 20px; 
 width: 46px; 
 height: 46px; 
 background-color: #e60000;  
 color: #fff; 
 border-radius: 5px;
 text-align: center; 
 line-height: 42px; 
 cursor: pointer; 
 transform: translateY(100px); 
 transition: all 0.5s ease;
}
.showBtn {
 opacity: 1; 
 transform: translateY(0);
}
.hide {
  visibility: hidden;
}
</style>

最后在全局加一个

*{ scroll-behavior: smooth;//平滑滚动}