Vaadin 21 菜单栏与导航选项卡

Question

上下文：Vaadin 21，Java 8。

在 Vaadin 21 示例应用程序（来自 https://start.vaadin.com/app/）之上，我编写了自己的 RouterLayout，导航栏在顶部，正文在中间，页脚在底部（作为示例中的 MainLayout 的交换）应用程序）。

在导航栏中，我放了一个 MenuBar ( https://vaadin.com/docs/latest/ds/components/menu-bar )，其中包含一些 RouterLinks。

当用户点击MenuBar 中的RouterLinks 之一时，整个页面都会刷新，我的RouterLayout 也会重新实例化（= 调用构造函数）。

当我通过Tabs 组件（https://vaadin.com/docs/latest/ds/components/tabs）交换MenuBar 时，然后像以前一样单击相同的RouterLink 只是交换RouterLayout 中的正文内容（如预期的那样）。

我在https://vaadin.com/docs/latest/ds/components/menu-bar 知道这个提示，但我不知道为什么MenuBar 和Tabs 之间存在差异：

菜单栏不应用于导航。使用选项卡进行切换 在内容之间，或用于常规导航的锚元素之间。

所以我的问题是：

1. 为什么MenuBar 和Tabs 在导航中存在差异（页面刷新），即使我在两种情况下都使用相同的代码创建RouterLink？
2. 为什么MenuBar 不能用于导航？
3. 有没有办法在不刷新页面的情况下使用MenuBar 进行导航？

Answer 1

为什么菜单栏不能用于导航？

我认为主要原因是因为默认情况下 Vaadin 菜单栏不使用 <a href> 元素，而是依赖于 JS 事件侦听器。如果在技术上可以在其中使用锚点，我想应该没问题。

不过，我认为这对于辅助技术用户来说并不是最好的体验，因为所有/大部分链接最初都会被隐藏（您需要手动打开每个菜单才能看到它们）。