当前位置:Gxlcms > JavaScript > vue2.0怎样实现模拟锚点

vue2.0怎样实现模拟锚点

时间:2021-07-01 10:21:17 帮助过:3人阅读

这次给大家带来vue2.0怎样实现模拟锚点,vue2.0实现模拟锚点的注意事项有哪些,下面就是实战案例,一起来看一下。

解决办法:

<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
 }
}

相信看了本文案例你已经掌握了方法,更多精彩请关注Gxl网其它相关文章!

推荐阅读:

vue项目中怎么使用sass配置

IView中on-change属性如何使用

以上就是vue2.0怎样实现模拟锚点的详细内容,更多请关注Gxl网其它相关文章!

人气教程排行