几种方法:
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值