router-link-active 与 router-link-exact-active 区别
router-link-exact-active 是精确匹配规则,即只有当前点击router被匹配
router-link-active 默认是全包含匹配规则,即path名全包含在当前router path名开头的router也会被匹配到。
1. <router-link to='/'>
2. <router-link to='/a'>
3. <router-link to='/b'>
4. <router-link to='/ab'>
2/3号被选中 1号也会被匹配到router-link-active,4号被选中1号2号两个也会被匹配到router-link-active。
可以通过在router添加exact属性改变为精精确匹配。
我遇到两个router同时匹配class:router-link-active 的情况,而我预期是被点击的router匹配。查了官方文档得知

router-link-active 与 router-link-exact-active 区别的更多相关文章
- 如何消除移动端a标签点击时的蓝色底色以及a标签link、visited、hover、active的顺序
1.消除a标签移动端点击时的蓝色底色 -webkit-tap-highlight-color:transparent 2.link.visited.hover.active的顺序 a:link{tex ...
- a:link,a:visited,a:hover,a:active
1:解释 link:连接平常的状态 visited:连接被访问过之后 hover:鼠标放到连接上的时候 active:连接被按下的时候 详细的: :hover版本:CSS1/CSS2 兼容性 ...
- a标签的link、visited、hover、active的顺序
a标签的link.visited.hover.active是有一定顺序的,以下是我一直在用的一个顺序,能正确显示四个颜色,我也不知道有没有其他的顺序能正确显示,如果你没办法判断哪个是对的,那就先用这个 ...
- css中链接的4个状态 link、visited 、hover、active 顺序与设置
link 未点时链接色visited 已点过的链接色hover 光标放入链接上的色active 点击时的样式 顺序一定要按link.visited.hover.active来设置 ...
- [Angular2 Router] Programmatic Router Navigation via the Router API - Relative And Absolute Router Navigation
In this tutorial we are going to learn how to navigate programmatically (or imperatively) by using t ...
- javadoc中{@link}与@see的简单使用以及区别
因为公司的测试直接对着java api进行外部服务的测试,故最近对javadoc的要求从0变成了严重依赖,有些时候在javadoc不得不引用其他class,以便更加清晰的说明上下文以及含义,发现指向别 ...
- Difference between a Hard Link and Soft (Symbolic) Link
Within the Unix/Linux file system, linking lets you create file shortcuts to link one or more files. ...
- java.lang.IllegalStateException: Active Spring transaction synchronization or active JTA transaction with specified [javax.transaction.TransactionManager] required
错误信息: java.lang.IllegalStateException: Active Spring transaction synchronization or active JTA trans ...
- 转载:Linux: What’s the difference between a soft link and a hard link?
Link:https://www.moreofless.co.uk/linux-difference-soft-symbolic-link-and-hard-link/ This example sh ...
- a:link a:visited a:hover a:active四种伪类选择器的区别
a:link选择网页中所有没有被visited的a标签,就是没有鼠标悬停hover或者点击click(a链接没有被访问时的样式) a:visited选择网页中所有已经被click的a链接,用来告诉用户 ...
随机推荐
- Java 设计模式—装饰者模式
在Java编程语言中,嵌套了非常多设计模式的思想,比如IO流中的缓冲流就使用到以下要介绍的装饰者设计模式. 演示样例代码: * 抽象构件角色:定义一个抽象接口,来规范准备附加功能的类 * @autho ...
- 读书笔记-HBase in Action-第一部分 HBase fundamentals
新项目准备上HBase.HBase眼下由组里某牛负责.本着学会使用HBase的目标,先阅读下HBase in Action,一共十章组织成三部分,须要学习的内容包含HBase基本实现原理,用法,Sch ...
- @SpringBootApplication注解
@SpringBootApplication注解表明了SpringBoot的核心功能,即自动配置. @SpringBootApplication(主配置类): @SpringBootConfigura ...
- SQL Server2012 T-SQL基础教程--读书笔记(8 - 10章)
SQL Server2012 T-SQL基础教程--读书笔记(8 - 10章) 示例数据库:点我 CHAPTER 08 数据修改 8.1 插入数据 8.1.1 INSERT VALUES 语句 8.1 ...
- 74.资金管理-员工工资配置 extjs 页面
1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8&quo ...
- PCB SLOT槽孔数量计算方法,同CAM350孔数一致 实现方法
最近有好几个写脚本的朋友问我,SLOT槽孔孔的如何计算的,要求孔数与CAM350孔数保持一致. 前几年通过在CAM350里面不断测试,结果是:CAM 350中SLOT槽孔,孔与孔之间最高位,凸位高度值 ...
- Android PopWindow的替代品BasePopup
版权声明:本文为xing_star原创文章,转载请注明出处! 本文同步自http://javaexception.com/archives/109 背景描述 最近一段时间,又看到了这个开源项目Base ...
- 使用Github做服务器展示前端页面
1)在github上创建自己一个项目,项目名称必须是你的github账号名.github.io 譬如 fk123456.github.io 因为我已经创建了,所以显示名字重复. 2)使用命令行的方式 ...
- Scala学习2 ———— 三种方式完成HelloWorld程序
三种方式完成HelloWorld程序 分别采用在REPL,命令行(scala脚本)和Eclipse下运行hello world. 一.Scala REPL. 按照第一篇在windows下安装好scal ...
- A - Team
Problem description One day three best friends Petya, Vasya and Tonya decided to form a team and tak ...