vue 锚点

最新推荐文章于 2024-01-10 21:12:14 发布

月色*如浅梦

最新推荐文章于 2024-01-10 21:12:14 发布

阅读量105

点赞数

本文链接：https://blog.csdn.net/weixin_49376627/article/details/126407089

版权

关键词由CSDN通过智能技术生成

<div class="nav">
      <a href="javascript:" @click="goAnchor('1')">Java</a>
      <a href="javascript:" @click="goAnchor('2')">Python</a>
      <a href="javascript:" @click="goAnchor('3')">Javascript</a>
    </div>

    <!-- 内容 -->
    <div class="item">
      <div class="title" id="page">Java</div>
      <div class="content"></div>
    </div>

    <div class="item">
      <div class="title" id="page2">Python</div>
      <div class="content"></div>
    </div>

    <div class="item">
      <div class="title" id="page3">Javascript</div>
      <div class="content"></div>
    </div>
Vue项目通过scrollIntoView实现锚点滚动
this.$el.querySelector('#page' + key).scrollIntoView({
  behavior: "smooth",  // 平滑过渡
  block:    "start"  // 上边框与视窗顶部平齐。默认值
});