vue.js中滚动到特定的位置

在项目中要求点击banner之后滚动到特定的位置。
查询了资料后发现了几种方法：
1.scrollIntoView()

 

   

   

     

     ...
   
 

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

这样div顶部会滚动到与视窗的顶部对齐，如果要求跟顶部留一点距离呢？别急，还有一种方法。
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值