解决vue路由与锚点冲突
传统的锚点定位会与vue-router中的路由设置存在冲突,解决方法自定义锚点跳转:
html:
<ul>
<li><a href="" @click.prevent="custormAnchor('firstAnchor')">公共报文头</a></li>
</ul>
js:
methods: {
custormAnchor(anchorName) {
// 找到锚点
let anchorElement = document.getElementById(anchorName);
// 如果对应id的锚点存在,就跳转到锚点
if(anchorElement) { anchorElement.scrollIntoView(); }
}
}
解决vue路由与锚点冲突的更多相关文章
- 解决vue与传统jquery插件冲突
比如基于jquery的select2插件,在vue下单独用有很多问题,其实对于这类插件,可以用vue的自定义指令和组件来包装,解决冲突的问题.引用官方vue1.0和2.0的两个例子,学习一下. 例子1 ...
- vue路由传参的三种方式以及解决vue路由传参页面刷新参数丢失问题
最近项目中涉及到跨页面传参数和后台进行数据交互,看到需求之后第一反应就是用路由传参来解决:Vue中给我们提供了三种路由传参方式,下面我们一个一个的来看一下: 方法一:params传参: this.$r ...
- 第七十三篇:解决Vue组件中的样式冲突
好家伙, 1.组件之间的样式冲突 默认情况下,写在.vue组件中的样式会全局生效,因此很容易造成多个组件之间的样式冲突问题. 举个例子: 我们在Left.vue的组件中添加样式 <templat ...
- 2种方式解决vue路由跳转未匹配相应路由避免出现空白页面或者指定404页面
https://www.cnblogs.com/goloving/p/9254084.html https://www.cnblogs.com/goloving/p/9254084.html 1.路由 ...
- 解决vue路由history模式刷新后404的问题
server { listen ;#默认端口是80,如果端口没被占用可以不用修改 server_name localhost; root E:/vue/my_project/dist;#vue项目的打 ...
- 解决vue单页路由跳转后scrollTop的问题
作为vue的初级使用者,在开发过程中遇到的坑太多了.在看页面的时候发现了页面滚动的问题,当一个页面滚动了,点击页面上的路由调到下一个页面时,跳转后的页面也是滚动的,滚动条并不是在页面的顶部 在我们写路 ...
- vue路由跳转报错解决
vue路由跳转: setTimeout(function () { console.log(this); this.$router.push("/login"); },800) 语 ...
- Vue路由跳转到新页面时 默认在页面最底部 而不是最顶部 的解决
今天碰到一个问题 vue路由跳转到新的页面时会直接显示页面最底部 正常情况下是显示的最顶部的 而且好多路由中不是全部都是这种情况 折腾好长时间也没解决 最后在网上找到了解决办法 其实原理很 ...
- vue路由原理剖析
单页面应用(SPA)的核心之一是: 更新视图而不重新请求页面, 实现这一点主要是两种方式: 1.Hash: 通过改变hash值 2.History: 利用history对象新特性(详情可出门左拐见: ...
随机推荐
- Linux java项目冲突不能正常运行
部署项目,在windows环境部署到Tomcat能够正常运行,部署到Linux环境下只能访问一些html资源,不能正常运行. 解决步骤: 1.清除webapps目录下所有文件夹,将war包上传至web ...
- USACO 1.3.3 Calf Flac(Manacher算法)
Description 据说如果你给无限只母牛和无限台巨型便携式电脑(有非常大的键盘),那么母牛们会制造出世上最棒的回文.你的工作就是去寻找这些牛制造的奇观(最棒的回文). 在寻找回文时不用理睬那些标 ...
- 作业 20181030-3互评Alpha版本
此作业要求参见:https://edu.cnblogs.com/campus/nenu/2018fall/homework/2323 组名:可以低头,但没必要 组长:付佳 组员:张俊余 李文涛 孙 ...
- “Hello World!”团队第七次Scrum立会
"Hello world!"团队召开第七次Scrum立会.博客内容: 1.会议时间 2.会议成员 3.会议地点 4.会议内容 5.Todo list 6.会议照片 7.燃尽图 一. ...
- 安装VS的过程
软件工程学习到第三周,我们需要下载一个新的软件,用来进行软件测试.刚开始知道的时候觉得没甚么,不就是下个软件吗!有什么大不了的,分分钟搞定的事.可是想象很美好,现实很骨感.这是一个巨大的工作量呀,不仅 ...
- 给个理由走下去——读《我是一只IT小小鸟》有感
和很多人一样,高考失利,迷迷茫茫的走进了软件学院.关于这个专业,具体学什么是一概不知,只知道学软件的很帅很帅,幻想着以后当个行侠仗义的黑客,或是开发一款自己的游戏都是十分诱惑人的.然而这个世界有个不成 ...
- 面试Tips
面试Tips 面向对象:准备找工作的同学 内容概述:关于面试的一些经验总结,希望能带给你些许帮助.若有描述不准确的地方,欢迎指点建议. 内容提炼:共分为四阶段 1.面试前之静生慧 (1)课本知识过一遍 ...
- Hibernate:工作原理
Hibernate的工作原理图如下所示:
- Qt使用QNetworkAccessManager实现Http操作
版权声明:若无来源注明,Techie亮博客文章均为原创. 转载请以链接形式标明本文标题和地址: 本文标题:Qt使用QNetworkAccessManager实现Http操作 本文地址:http ...
- 【转】Apache httpd.conf配置解释
转自:http://jafy00.blog.51cto.com/2594646/501373 常用配置指令说明 1. ServerRoot:服务器的基础目录,一般来说它将包含conf/和logs/子目 ...