【vue】router-link 第一个默认选中,exact当地址为 / 的时候被激活,点击高亮等问题
2019-03-18 12:16
901 查看
1.在点击导航栏的时候,让被点击的那一个有背景色,其他的没有背景色?
如何做?
在路由里面设置router/index.js
此时页面中会激活open 及active属性
在谷歌浏览器检查是否加载,在样式添相应样式即可
.active{
color:red;
}
但是此时我们发现 to=’/’ 一直高亮
举个例子,如果当前的路径是 /a 开头的,那么 也会被设置 CSS 类名。
按照这个规则,每个路由都会激活!想要链接使用 “exact 匹配模式”,则使用 exact 属性:
添加exact 属性后默认 路径没有高亮,解决办法如下
相关文章推荐
- vue-router 二级导航默认选中某一选项的问题
- vue2.x---vue-router如何在router-link标签绑定click点击事件、keyup、change等事件
- RadioGroup动态添加RadioButton,RadioButton设置默认选中第一个,点击其他的RadioButton第一个不再选中,第一个不再选中
- Vue日常笔记之路由router默认主页激活样式Active一直存在
- vue.js默认路由不加载linkActiveClass问题的解决方法
- vue.js 关于router-link的相关样式问题
- 开发细节--点击cell的时候,默认的点击效果覆盖控件背景色的问题
- vue中当图片地址无效的时候,显示默认图片
- vue-router二级路由会加上router-link-exact-active router-link-active
- vue-router 如何在当前路由下重新点击当前路由的router-link实现刷新
- router-link 设置链接激活时使用的 CSS 高亮
- vue-router 如何在当前路由下重新点击当前路由的router-link实现刷新 组件重新渲染
- vue-cli 默认路由再子路由选中下的选中状态问题及解决代码
- vue.js之编程式路由-给router-link的点击事件
- Vue 列表动态绑定点击样式(active class)以及路由router-link点击样式(router-active-class)
- vue中当图片地址无效的时候,显示默认图片的方法
- 当多个<router />使用同一个组件的时候,切换页面地址,页面不刷新的问题
- 在vue中无论使用router-link 还是 @click事件,发现都没法从列表页点击跳转到内容页去
- vue 的 router-link 添加点击事件
- arcgis for android空间查询 点击某点,选中该点所在区域,高亮显示