语义 UI - 以下菜单示例

Question

我是 Semantic UI 的新手，我想实现以下菜单，如右侧 Semantic UI's documentation 所示。我想将此功能实现到固定顶部菜单 - 所以当达到标题元素的 id 时，应该更改菜单中的活动元素。我正在查看 docs.js 的代码，该代码是为文档站点实现的，但如果您是第一次使用 Semantic UI，则此代码非常复杂。我的菜单有这些类：ui large top fixed hidden menu

是否已经有内置的以下菜单（可能没有，因为文档中没有提到它？）或者我用 jQuery 添加它？

Answer 1

semantic-ui 只为您提供样式。单击菜单项后，您可以自行更新该项的活动状态。

这就是我们在代码中实现它的方式 -

const menuNav = $('.ui.menu.menu-component .item');
menuNav.on('click', function (item) {
  menuNav.removeClass('active');
  $(this).addClass('active');
});

要记住的另一件事是，您需要在页面加载时检查 URL，以便将适当的项目标签设置为活动。