当前位置： 移动技术网 > IT编程>脚本编程>vue.js > vue2.0模拟锚点的实例

vue2.0模拟锚点的实例

2018年04月02日  | 移动技术网IT编程  | 我要评论

锦州虎跃快客时刻表,英国乐器,王坤和蔡慧近况

在vue项目中，因为采用路由跳转，会导致无法使用常规的a标签配合id的锚点功能。

解决办法：

<a href="javascript:void(0)" rel="external nofollow" @click="goanchor('#anchor')"> 灰啊灰啊我的骄傲放纵</a>
methods: {
 goanchor(selector) {
  var anchor = this.$el.queryselector(selector)
  document.body.scrolltop = anchor.offsettop
 }
}

17. 9. 20 更新： 以上在firefox有bug，修复如下：

methods: {
 goanchor(selector) {
  var anchor = this.$el.queryselector(selector)
  document.body.scrolltop = anchor.offsettop; // chrome
  document.documentelement.scrolltop = anchor.offsettop; // firefox
 }
}

以上这篇vue2.0模拟锚点的实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持移动技术网。

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网