清哥的小屋

本文同步自 CSDN · 清阿哥，原文发布于 2020-10-29。

废话不多说先上代码

1
<div class="back-top-item" @click="turnFeeConsultation">
2
      <div class="feeConsultation"></div>
3
     <p class="text">收费咨询</p>
4
</div>

1
turnFeeConsultation() {
2
      this.$nextTick(() =>
3
        document.getElementsByClassName('paidConsultation')[0].scrollIntoView({ behavior: 'smooth', block: 'start', inline: 'nearest' });
4
      });
5
    }

scrolIintoView 布尔值参数

• scrollintoView(true) 或者scrollIntoView()相当于scrollIntoViewOptions: {block: “start”, inline: “nearest”}
• scrollintoView(false) 相当于scrollIntoViewOptions: {block: “end”, inline: “nearest”}

scrolIintoView 布对象参数

• behavior（可选）定义动画过渡效果， “auto” 瞬间跳转（没有动画效果）或 “smooth”（由动画效果平滑的到指定位置） 之一。默认为 “auto”
• block（可选）定义垂直方向的对齐， “start”, “center”, “end”, 或 “nearest”之一。默认为 “start”。
• inline（可选）定义水平方向的对齐， “start”, “center”, “end”, 或 “nearest”之一。默认为 “nearest”