去掉router-link 默认样式

可以通过以下方法去掉 `router-link` 的默认样式：

1. 使用 `:class` 属性绑定自定义样式类：

<router-link :to="{path: '/home'}" class="custom-link">Home</router-link>

.custom-link {
  text-decoration: none;
  color: inherit;
}

2. 在全局样式表中定义样式：

a.router-link-active {
  /* 去掉 active 状态下的默认下划线 */
  text-decoration: none !important;
}

需要注意的是，`router-link` 默认的 `tag` 是 `a`，如果你改变了 `tag`，那么上述方法可能会失效，需要根据实际情况调整样式。

相关问题

去除router-link下划线

要去除router-link下划线，可以使用以下两步操作：
1. 给a标签添加CSS样式控制，将text-decoration设为none，即去掉下划线。
2. 同样地，给router-link-active类添加CSS样式控制，也将text-decoration设为none，以确保活动链接状态下的下划线也被去除。

具体的代码示例如下：

#### 引用[.reference_title]
-  *1* [vue router-link 默认a标签去除下划线的实现](https://download.csdn.net/download/weixin_38560502/14712120)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"]
-  *2* [去掉router-link文字的下划线](https://blog.csdn.net/weixin_52418790/article/details/117361939)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"]
-  *3* [Vue中消除router-link下划线](https://blog.csdn.net/qq_51114283/article/details/119560945)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"]
[ .reference_list ]

vue router-link去掉下划线

要去掉Vue的router-link下划线，你可以通过自定义样式来实现。默认情况下，router-link会带有下划线并且是蓝色的。你可以使用以下样式代码来去除下划线：

a标签点击前的样式：

a {
   text-decoration: none;
   color: #000;
}

router-link点击后的样式：

.router-link-active {
   text-decoration: none;
   color: red;
}

通过添加这些样式，你可以去除下划线并自定义router-link的颜色。希望这对你有所帮助！<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* [vue router-link 默认a标签去除下划线的实现](https://download.csdn.net/download/weixin_38560502/14712120)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
- *2* *3* [Vue中消除router-link下划线](https://blog.csdn.net/qq_51114283/article/details/119560945)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]