博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
进入页面跳转到指定锚点
阅读量:6290 次
发布时间:2019-06-22

本文共 398 字,大约阅读时间需要 1 分钟。

问题

在Vue实例完成之后,将锚点定位到指定元素。

分析:

如何实现,这是一个问题。首先生命周期函数,放在created钩子中,这个时候页面还没有渲染完成,如果进行锚点跳转,很可能就无法跳转到指定位置。因此只能放在生命周期钩子mounted中。

但是,如果直接使用location.hash也是有可能无法正常跳转,因此,要保证正常跳转,就要把跳转锚点的代码放在事件队列的最好,这个时候就要使用setTimeout(() => {}, 0)了。

解决方案:

  1. 在生命周期钩子mounted写代码
  2. 将跳转锚点的代码放在事件队列的最后

代码实现

var vm = new Vue({    el: '#app',    mounted() {      setTimeout(function () {        location.hash = 'item4'      }, 0)    }  })

转载地址:http://ogkta.baihongyu.com/

你可能感兴趣的文章
<三体> 给岁月以文明, 给时光以生命
查看>>
Android开发 - 掌握ConstraintLayout(九)分组(Group)
查看>>
springboot+logback日志异步数据库
查看>>
Typescript教程之函数
查看>>
Android 高效安全加载图片
查看>>
vue中数组变动不被监测问题
查看>>
3.31
查看>>
类对象定义 二
查看>>
收费视频网站Netflix:用户到底想要“点”什么?
查看>>
MacOS High Sierra 12 13系统转dmg格式
查看>>
关于再次查看已做的多选题状态逻辑问题
查看>>
动态下拉菜单,非hover
查看>>
政府安全资讯精选 2017年第十六期 工信部发布关于规范互联网信息服务使用域名的通知;俄罗斯拟建立备用DNS;Google打击安卓应用在未经同意情况下收集个人信...
查看>>
简单易懂的谈谈 javascript 中的继承
查看>>
iOS汇编基础(四)指针和macho文件
查看>>
Laravel 技巧锦集
查看>>
Android 使用 ViewPager+RecyclerView+SmartRefreshLayout 实现顶部图片下拉视差效果
查看>>
Flutter之基础Widget
查看>>
写给0-3岁产品经理的12封信(第08篇)——产品运营能力
查看>>
ArcGIS Engine 符号自动化配置工具实现
查看>>