Vaadin 24子菜单路由：移除RouterLink悬停下划线的方案

Vaadin 24没有原生提供功能完全等同于RouterLink但无下划线的组件，你有两种可行的解决方式：

方案一：修改RouterLink的样式（推荐） #

这种方式能保留RouterLink的所有原生特性（比如路由激活状态自动高亮、路由参数支持等），只需通过CSS去掉下划线：

步骤1：给RouterLink添加自定义样式类 #

RouterLink routerLink = new RouterLink("Select Applicants for Invitations", AboutView.class);
routerLink.addClassName("menu-link-no-underline");
monthlyTasksSubMenu.addItem(routerLink);

步骤2：在全局样式文件（如styles.css）中添加样式规则 #

利用Vaadin内置主题变量修改：

.menu-link-no-underline {
    --lumo-link-text-decoration: none;
    --lumo-link-hover-text-decoration: none;
}

或者直接覆盖文本装饰属性：

.menu-link-no-underline,
.menu-link-no-underline:hover {
    text-decoration: none;
}

方案二：用MenuItem结合手动导航 #

如果不想使用RouterLink，可以直接添加MenuItem并手动处理导航逻辑，MenuItem默认样式无下划线：

MenuItem linkMenuItem = monthlyTasksSubMenu.addItem("Select Applicants for Invitations");
linkMenuItem.addClickListener(event -> {
    UI.getCurrent().navigate(AboutView.class);
});

注意：这种方式需要你自己处理路由激活状态的高亮逻辑，不如RouterLink省心。

内容的提问来源于stack exchange，提问作者Todd