router-link 默认选中颜色
时间: 2023-07-19 13:13:39 浏览: 81
router-link 默认选中颜色是蓝色(blue), 可以通过设置 CSS 样式来修改默认选中颜色。例如:
```css
.router-link-exact-active {
color: red;
}
```
这样就将选中时的颜色修改为红色。
相关问题
router-link 默认选中路由
router-link 组件在当前路由与其 to 属性所指的路由匹配时会自动添加一个 `.router-link-exact-active` 的类名,这个类名可以用来对当前被选中的路由进行样式设置。
但是,router-link 组件并不会默认选中任何一个路由,因为路由选中的状态是由用户在页面上的操作触发的。如果你想要在页面加载时自动选中某个路由,可以在 mounted 钩子函数中手动触发路由跳转,例如:
```javascript
mounted() {
this.$router.push('/some-route');
}
```
这样就会在页面加载时自动跳转到 `/some-route` 路由,并且 router-link 组件会自动添加 `.router-link-exact-active` 类名进行样式设置。
router-link 默认选中第一个
router-link 并不会默认选中第一个,它只是用来在 Vue.js 应用中实现路由导航的组件。在使用 router-link 的时候,需要设置它的 to 属性来指定路由跳转的目标地址,例如:
```
<router-link to="/home">Home</router-link>
<router-link to="/about">About</router-link>
```
这样就可以实现跳转到 Home 和 About 页面。如果想要默认选中第一个路由,可以在路由配置中设置默认路由,例如:
```
const router = new VueRouter({
routes: [
{
path: '/',
redirect: '/home'
},
{
path: '/home',
component: Home
},
{
path: '/about',
component: About
}
]
})
```
这样,当用户访问根路径时,就会自动跳转到 Home 页面。
阅读全文