vue中滚动到指定位置

几种方法:
1.scrollIntoView()
 <div ref="wrapper">
   <div  @click = goAnchor()></div>
   <ul id="idName" ref="refName">
     <li></li>
     ...
   </ul>
 </div>

goAnchor(){
  document.getElementById("idName").scrollIntoView();
  //或者
  document.querySelector("#idName").scrollIntoView();
  //或者
  this.$refs.refName.scrollIntoView();
}

2.scrollTop = xxx
我知道有人会写:

goAnchor(){
  document.documentElement.scrollTop = distance
}

如果不是监听window的scroll呢?那么这样写其实是没反应的。
这里我对wrapper监听scroll

this.$refs.wrapper.addEventListener('scroll', this.judgeScroll);

那么最后的scrollTop就写监听滚动的对象的scrollTop

goAnchor(){
  this.$refs.wrapper.scrollTop = xxx
}

3.使用a标签锚点
不适合在vue.js项目中使用,会干扰路由里的hash值

上一篇:(精读spring-framework-v5.3.5)环境搭建


下一篇:装饰器应用