下面我就為大家分享一篇vue2.0模擬錨點的實例,具有很好的參考價值,希望對大家有幫助。
在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模擬錨點的實例的詳細內容。更多資訊請關注PHP中文網其他相關文章!