html 跳转到页面指定位置
创建目标组件并添加目标元素 假设我们想在 About.vue 组件中滚动到某个特定的位置。我们可以在 About.vue 中添加一个具有唯一 id属性的元素 <div id="service" class="service"> <div class="service-text" > <div class="service-text1">24H在线</div> <div class="service-text2">真人客服,永不失联</div> <div class="service-text3">我们的真人客服7x24小时在线,随时响应您的需求。无论问题大小,迅速解决,确保您的使用体验无忧,永不失联。</div> </div> </div> 添加滚动到指定位置的代码 <script> export default { methods: { scrollToElement(refID) { let time=setTimeout(()=>{ this.$nextTick(()=>{ let top=0; let targetElement=document.getElementById(refID); if(targetElement){ // 获取元素距离顶部的距离 top=targetElement.offsetTop; } if(top>0){ // 滚动到指定位置 window.scrollTo({ top: top, behavior: 'smooth' }); } clearTimeout(time); time=null; }) },300); }, } } </script> 最后,在你的 Home.vue 或其他组件中触发路由导航: <li><a href="javascript:void(0)" @click="scrollToElement('service')">联系我们</a></li>