实现页面缓慢滚动到顶部

在做项目网址时候，经常会用到实现页面缓慢滚动到顶部，今天我就来讲一下我知道的方法吧。

1，语法：window.scrollTo(options)

options 是一个包含三个属性的对象

top 等同于 y-coord
left 等同于 x-coord
behavior 类型String,表示滚动行为

behavior支持参数:

• smooth(平滑滚动),
• instant(瞬间滚动),
• 默认值auto,实测效果等同于instant

2，案例

<div class="scrollChild">
     <div>第一种</div>
     <button @click="scroll()">第一种方法</button>
</div>

<script>
export default {
 data() {
    return {
        scrollTop:''
    };
  },
  mounted() {
    this.scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
  },
  methods: {
    scroll() {
      window.scrollTo({
        top: 0,
        behavior: "smooth"
      });
    }
  }
}
<script>

git.gif