使用原生js如何实现回到顶部的功能

<template>
  <div>
    <div style="height: 200px; background-color: aqua;" v-for="(item ,i) in list"></div>
    <div class="BackTop" v-show="isBackShow" ref="BackTop" @click="BackTop">
    <img src="../../assets/images/home-active.png" alt="" />
  </div>

  </div>
 
</template>

<script>
export default {
  data() {
    return {
      isBackShow: false,
      list:[1,2,3,4,5,5,6,7,8,8,9,0,0,0,0,0,0,0,0,0]
    };
  },
  created() {
    window.addEventListener("scroll", this.onscroll);//监听页面滚动
  },
  methods: {
    onscroll() {
      let high = document.documentElement.scrollTop || document.body.scrollTop;//判断页面的滚动长度
      if (high >= 500) {
        this.isBackShow = true;
      } else {
        this.isBackShow = false;
      }
    },
    BackTop() {
      // 设置滚动行为改为平滑的滚动
      window.scrollTo({//回到顶部
        top: 0,
        behavior: "smooth",
      });
    },
  },
  beforeDestroy() {
    window.removeEventListener("scroll", this.onscroll);
  },
};