scrollIntoView 滚动页面到指定位置

scrollIntoView 作用：使指定元素滚动到页面可见范围

使用：

1. 给指定元素分配 class 或 id , 使js中能够选取到

2. 根据标志，获取到dom元素

3. scrollIntoView 滚动到指定位置，可选择滚动到页面中的位置及过渡动画

注意：页面可滚动时方法才生效

 

实例：

<template>
  <div id="aa">
    <button @click="goTo(50)">go to 50</button>
    <div v-for="i in 100" :key="i" :class="'p'+i">{{i}}</div>
  </div>
</template>

<script>
export default {
  methods: {
    goTo(n) {
      var el = document.getElementsByClassName('p' + n)[0]
      if (el) {
        el.scrollIntoView({block: "start", behavior: "smooth"})
      }
    }
  },
}
</script> 

<style>

</style>