vue2.0模拟锚点的实例
时间:2021-03-18 09:41:57|栏目:vue|点击: 次
在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
}
}
栏 目:vue
下一篇:webpack+vue.js构建前端工程化的详细教程
本文标题:vue2.0模拟锚点的实例
本文地址:http://www.codeinn.net/misctech/82882.html






