摘要：问题在实例完成之后，将锚点定位到指定元素。首先生命周期函数，放在钩子中，这个时候页面还没有渲染完成，如果进行锚点跳转，很可能就无法跳转到指定位置。解决方案在生命周期钩子写代码将跳转锚点的代码放在事件队列的最后代码实现
问题
在Vue实例完成之后，将锚点定位到指定元素。
分析：
如何实现，这是一个问题。首先生命周期函数，放在created钩子中，这个时候页面还没有渲染完成，如果进行锚点跳转，很可能就无法跳转到指定位置。因此只能放在生命周期钩子mounted中。
但是，如果直接使用location.hash也是有可能无法正常跳转，因此，要保证正常跳转，就要把跳转锚点的代码放在事件队列的最好，这个时候就要使用setTimeout(() => {}, 0)了。
解决方案：
在生命周期钩子mounted写代码
将跳转锚点的代码放在事件队列的最后
代码实现 var vm = new Vue({
el: "#app",
mounted() {
setTimeout(function () {
location.hash = "item4"
}, 0)
}
})
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/51335.html
摘要：问题在实例完成之后，将锚点定位到指定元素。首先生命周期函数，放在钩子中，这个时候页面还没有渲染完成，如果进行锚点跳转，很可能就无法跳转到指定位置。解决方案在生命周期钩子写代码将跳转锚点的代码放在事件队列的最后代码实现 问题 在Vue实例完成之后，将锚点定位到指定元素。 分析： 如何实现，这是一个问题。首先生命周期函数，放在created钩子中，这个时候页面还没有渲染完成，如果进行锚点跳...
摘要：那什么是锚点问题呢锚点是网页制作中超级链接的一种，又叫命名锚记。命名锚记像一个迅速定位器一样是一种页面内的超级链接，运用相当普遍。这是标签提供给我们的锚点解决方式。滚动条缓慢滚动到此为止，一个完整的锚点缓慢滚动就完成了，快去试试吧 showImg(https://segmentfault.com/img/bVbslYF);最近项目中遇到传统的锚点问题。那什么是锚点问题呢？ 锚点 是网页...
摘要：那什么是锚点问题呢锚点是网页制作中超级链接的一种，又叫命名锚记。命名锚记像一个迅速定位器一样是一种页面内的超级链接，运用相当普遍。这是标签提供给我们的锚点解决方式。滚动条缓慢滚动到此为止，一个完整的锚点缓慢滚动就完成了，快去试试吧 showImg(https://segmentfault.com/img/bVbslYF);最近项目中遇到传统的锚点问题。那什么是锚点问题呢？ 锚点 是网页...
摘要：链接与图像链接元素元素表示链接元素作用从当前页面跳转到指定页面属性设置指定跳转页面的路径路径分类相对路径相对于当前页面的路径绝对路径访问的路径地址不变化示例代码相对路径的链接文本阴影案例他是链接绝对路径的链接他也 链接与图像 链接元素 < a >元素 - 表示链接元素 作用 - 从当前html页面跳转到指定html页面 属性 href - 设置指定跳转html页面的路径 ...
摘要：链接与图像链接元素元素表示链接元素作用从当前页面跳转到指定页面属性设置指定跳转页面的路径路径分类相对路径相对于当前页面的路径绝对路径访问的路径地址不变化示例代码相对路径的链接文本阴影案例他是链接绝对路径的链接他也 链接与图像 链接元素 < a >元素 - 表示链接元素 作用 - 从当前html页面跳转到指定html页面 属性 href - 设置指定跳转html页面的路径 ...
阅读 3297·2023-04-26 03:05
阅读 1440·2019-08-30 13:09
阅读 1888·2019-08-30 13:05
阅读 811·2019-08-29 12:42
阅读 1360·2019-08-28 18:18
阅读 3430·2019-08-28 18:09
阅读 496·2019-08-28 18:00
阅读 1695·2019-08-26 12:10
