zoukankan      html  css  js  c++  java
  • vue2.0模拟锚点

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

    解决办法:

    <a href="javascript:void(0)" @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
        }
    }

     18. 5. 17 更新: 针对有好几个小伙伴提出的按此方法没有效果,统一回复如下

      1. 此方法中改变body的滚动距离只是一个示例,非通用,实际开发中,你要清楚到底是改变哪个元素才能达到你的效果。

       弄清楚这个,然后再去赋值。这是属于比较基础的知识。

            2. 还有就是,博客评论我看到都会回复,微信提问处理更快。But, 我只会提思路,不会直接给出代码,思想懒惰者勿扰!

  • 相关阅读:
    HDU
    2015 NCPC Problem G-Goblin Garden Guards
    二分答案
    多校 HDU-6312 Game (博弈)
    唯一分解定理
    欧拉函数
    发布系统遇到的问题解决
    ASP.Net数据导出Excel的几种方法
    项目管理计划书模版
    sql server2008附加数据库5120错误
  • 原文地址:https://www.cnblogs.com/hcxy/p/7396290.html
Copyright © 2011-2022 走看看