vue项目中锚点定位替代方式


Posted in Javascript onNovember 13, 2019

在vue项目中,使用锚点定位会和router的规则冲突,在项目中的表现就是第一次点击url改变了,但是没有跳转到锚点位置,再次点击才会跳转。所以在vue项目中定义一个方法不适用锚点定位:

scrollToSection() {
   let section = document.getElementById('section')
   if (section) {
    section.scrollIntoView()
   }
  }

html标签中绑定click事件就可以了

以上这篇vue项目中锚点定位替代方式就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
在JavaScript中使用inline函数的问题
Mar 08 Javascript
Jquery 设置标题的自动翻转
Oct 03 Javascript
js自定义事件及事件交互原理概述(二)
Feb 01 Javascript
jquery实现点击向下展开菜单项(伸缩导航)效果
Aug 22 Javascript
JS截取字符串实例详解
Nov 24 Javascript
jQuery实现查找链接文字替换属性的方法
Jun 27 Javascript
深入理解JavaScript中的块级作用域、私有变量与模块模式
Oct 31 Javascript
javascript 中的继承实例详解
May 05 Javascript
JS+HTML实现的圆形可点击区域示例【3种方法】
Aug 01 Javascript
js实现打字小游戏
Dec 17 Javascript
vue点击标签切换选中及互相排斥操作
Jul 17 Javascript
详解JavaScript执行模型
Nov 16 Javascript
微信小程序后端(java)开发流程的详细步骤
Nov 13 #Javascript
jQuery实现滑动星星评分效果(每日分享)
Nov 13 #jQuery
vue+导航锚点联动-滚动监听和点击平滑滚动跳转实例
Nov 13 #Javascript
jquery获取input输入框中的值
Nov 13 #jQuery
Vue 实现CLI 3.0 + momentjs + lodash打包时优化
Nov 13 #Javascript
在vue中使用防抖和节流,防止重复点击或重复上拉加载实例
Nov 13 #Javascript
在vue-cli中引入lodash.js并使用详解
Nov 13 #Javascript
You might like
php合并数组array_merge函数运算符加号与的区别
2008/10/31 PHP
PHP实现在windows下配置sendmail并通过mail()函数发送邮件的方法
2017/06/20 PHP
js 解决“options为空或不是对象”
2008/12/22 Javascript
JAVASCRIPT IE 与 FF中兼容问题小结
2009/02/18 Javascript
jquery getScript动态加载JS方法改进详解
2012/11/15 Javascript
js操作checkbox遇到的问题解决
2013/06/29 Javascript
js处理json以及字符串的比较等常用操作
2013/09/08 Javascript
jquery与js函数冲突的两种解决方法
2013/09/09 Javascript
使用GruntJS构建Web程序之构建篇
2014/06/04 Javascript
jquery使整个div区域可以点击的方法
2015/06/24 Javascript
jQuery焦点图轮播特效代码分享(3款)
2015/09/05 Javascript
javascript每日必学之运算符
2016/02/16 Javascript
聊一聊jQuery插件uploadify使用方法
2016/08/24 Javascript
JavaScript中push(),join() 函数 实例详解
2016/09/06 Javascript
详谈Angular 2+ 的表单(一)之模板驱动型表单
2017/04/25 Javascript
微信小程序页面开发注意事项整理
2017/05/18 Javascript
React-Native中props具体使用详解
2017/09/04 Javascript
基于Vue框架vux组件库实现上拉刷新功能
2017/11/28 Javascript
vue router动态路由下让每个子路由都是独立组件的解决方案
2018/04/24 Javascript
vue-cli脚手架搭建的项目去除eslint验证的方法
2018/09/29 Javascript
AngularJS 监听变量变化的实现方法
2018/10/09 Javascript
jquery.pager.js分页实现详解
2019/07/29 jQuery
解决vue-router 二级导航默认选中某一选项的问题
2019/11/01 Javascript
详解Python中列表和元祖的使用方法
2015/04/25 Python
python sort、sort_index方法代码实例
2019/03/28 Python
Pyspark读取parquet数据过程解析
2020/03/27 Python
Python打印特殊符号及对应编码解析
2020/05/07 Python
python实现时间序列自相关图(acf)、偏自相关图(pacf)教程
2020/06/03 Python
利用CSS3的特性改变文本选中时的颜色
2013/09/11 HTML / CSS
详解CSS3中nth-child与nth-of-type的区别
2017/01/05 HTML / CSS
大学活动总结格式
2014/04/29 职场文书
保研推荐信
2014/05/09 职场文书
2014年司法所工作总结
2014/11/22 职场文书
企业培训简报范文
2015/07/20 职场文书
抖音短视频(douyin)去水印工具的实现代码
2021/03/30 Javascript
oracle索引总结
2021/09/25 Oracle