vue-router：如何从路由器链接中删除下划线

Question

这会产生一个带下划线的链接：

 <li><router-link to="/hello">Hello</router-link></li>

我的理解是 router-link 元素会生成一个 a 标签。

我在 CSS 中尝试过这些东西：

 router-link{
    text-decoration: none;
}

---

 router-link a{
    text-decoration: none;
}

---

 router-link a{
    text-decoration: none !important;
}

..但不幸的是，这些都不起作用。

原文由 rpivovar 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

Vue 组件标签不会生成 HTML 标签。

在 DOM 检查器中查看实际存在的 HTML 标记。

您需要使用常规的类名。

原文由 SLaks 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

即使在 React-Router 中。 Link 标签使文本带有下划线。因为标签内的任何文本（h1，h3，p）都被转换为锚标签，所以：

 a{text-decoration: none;}

原文由 amit.exe 发布，翻译遵循 CC BY-SA 4.0 许可协议