码迷,mamicode.com
首页 > 其他好文 > 详细

进入页面跳转到指定锚点

时间:2020-01-17 20:45:55      阅读:197      评论:0      收藏:0      [点我收藏+]

标签:页面   跳转   队列   java   strong   hash   new   app   article   

问题

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

分析:

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

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

解决方案:

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

代码实现

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

进入页面跳转到指定锚点

标签:页面   跳转   队列   java   strong   hash   new   app   article   

原文地址:https://www.cnblogs.com/jlfw/p/12207344.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!