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 相关文章推荐
js+xml生成级联下拉框代码
Jul 24 Javascript
JavaScript截断字符串的方法
Jul 15 Javascript
less简单入门(CSS 预处理语言)
Mar 08 Javascript
xmlplus组件设计系列之按钮(2)
Apr 26 Javascript
实现图片首尾平滑轮播(JS原生方法—节流)
Oct 17 Javascript
详解webpack多页面配置记录
Jan 22 Javascript
微信小程序实现日期格式化和倒计时
Nov 01 Javascript
javascript导出csv文件(excel)的方法示例
Aug 25 Javascript
基于原生js实现九宫格算法代码实例
Jul 03 Javascript
js实现双色球效果
Aug 02 Javascript
在Vue 中获取下拉框的文本及选项值操作
Aug 13 Javascript
vue实现列表拖拽排序的功能
Nov 02 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开发大型项目的一点经验
2006/10/09 PHP
xajax写的留言本
2006/11/25 PHP
服务器web工具 php环境下
2010/12/29 PHP
PHP5中虚函数的实现方法分享
2011/04/20 PHP
DISCUZ在win2003环境下 Unable to access ./include/common.inc.php in... 的问题终极解决方案
2011/11/21 PHP
PHP 面向对象详解
2012/09/13 PHP
基于php下载文件的详解
2013/06/02 PHP
PHP最常用的正则表达式
2017/02/13 PHP
js设置文本框中焦点位置在最后的示例代码(简单实用)
2014/03/04 Javascript
利用Keydown事件阻止用户输入实现代码
2014/03/11 Javascript
js实现点击后将文字或图片复制到剪贴板的方法
2014/08/04 Javascript
基于javascript实现漂亮的页面过渡动画效果附源码下载
2015/10/26 Javascript
jQuery实用技巧必备(上)
2015/11/02 Javascript
JavaScript触发onScroll事件的函数节流详解
2016/12/14 Javascript
原生JS实现《别踩白块》游戏(兼容IE)
2017/02/20 Javascript
ES6解构赋值的功能与用途实例分析
2017/10/31 Javascript
浅谈Vue Element中Select下拉框选取值的问题
2018/03/01 Javascript
用原生JS实现爱奇艺首页导航栏代码实例
2019/09/19 Javascript
python批量生成本地ip地址的方法
2015/03/23 Python
python调用机器喇叭发出蜂鸣声(Beep)的方法
2015/03/23 Python
Python中__name__的使用实例
2015/04/14 Python
Python的Flask框架应用调用Redis队列数据的方法
2016/06/06 Python
Python实现输出程序执行进度百分比的方法
2017/09/16 Python
利用python实现微信头像加红色数字功能
2018/03/26 Python
django中使用POST方法获取POST数据
2019/08/20 Python
python爬虫把url链接编码成gbk2312格式过程解析
2020/06/08 Python
CSS3解决移动页面上点击链接触发色块的问题
2016/06/03 HTML / CSS
Html5定位终极解决方案
2020/02/05 HTML / CSS
Hurley官方网站:扎根于海滩生活方式的全球青年文化品牌
2020/05/18 全球购物
几道数据库的概念性面试题
2014/05/30 面试题
我的梦中国梦演讲稿
2014/04/23 职场文书
全国法制宣传日活动总结2014
2014/11/01 职场文书
2015年信息宣传工作总结
2015/05/26 职场文书
高效课堂教学反思
2016/02/24 职场文书
Apache SeaTunnel实现 非CDC数据抽取
2022/05/20 Servers
SQL Server使用CROSS APPLY与OUTER APPLY实现连接查询
2022/05/25 SQL Server