英文:
Main page route is always highlighted on Vaadin
问题
I have a problem with Vaadin MainLayout. I use Vaadin with Spring Boot to create a UI for my backend. I created a layout used this Vaadin documentation to style the page.
a[highlight] {
font-weight: bold;
text-decoration: underline;
}
In my project, even if I go to another page, the main layout stays highlighted with bold and underline on the drawer which of the page. Here is my route annotation of the main page.
@Route(value = "", layout = MainLayout.class)
If I add a value to Route, the problem solves, but I don't want to add a value because it is the main page. How can I solve it with editing CSS. Thanks for your help.
英文:
I have a problem with Vaadin MainLayout. I use Vaadin with Spring Boot to create a UI for my backend. I created a layout used this Vaadin documentation to style the page.
a[highlight] {
font-weight: bold;
text-decoration: underline;
}
In my project, even if I go to another page the main layout stays highlighted with bold and underline on the drawer which of the page. Here is my route annotation of the main page.
@Route(value = "", layout = MainLayout.class)
If I add a value to Route the problem solves but I don't want to add a value because it is the main page. How can I solve it with editing CSS. Thanks for your help.
答案1
得分: 2
RouterLink 有一个奇怪的默认设置，用于标记活动路由，它会高亮显示与活动路由具有相同路径开头的任何路由。因为，大概率情况下，您的主视图映射到一个空字符串，所以它会一直匹配。您可以像这样覆盖高亮条件：
var link = new RouterLink();
link.setHighlightCondition(HighlightConditions.sameLocation());
有一个关于这个功能的问题：https://github.com/vaadin/flow/issues/13256
英文:
RouterLink has an odd default for marking routes as active, highlighting any routes that start with the same path as active. Because, presumably, your main view is mapped to an empty string, it will always match. You can override the highlight condition like this:
var link = new RouterLink();
link.setHighlightCondition(HighlightConditions.sameLocation());
There is an issue about the functionality: https://github.com/vaadin/flow/issues/13256
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论