使用任意数量的查询参数突出显示活动 link

Question

我试图通过添加“active”css class with ("active", isActivePath MyAction) 来突出显示主导航栏中的 link，但是有效我希望它也添加“活动”class，即使该操作在 url 中有一些参数，例如：

此代码：

<a class={classes ["nav-link dropdown-toggle", ("active", isActivePath ItemsAction)]} href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

正确突出显示 URL /Items，但如果 url 是 /Items?category=HelloKitty 或附加到 url 的任何其他内容，它不会突出显示。

如果 base-url 或 url 的开头是 /Items 而不管它后面有什么，有没有办法让它突出显示？

谢谢！

Answer 1

查看 isActivePathOrSub。它完全符合您的要求。

那么代码应该是这样的：

<a class={classes ["nav-link dropdown-toggle", ("active", isActivePathOrSub ItemsAction)]} href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

使用任意数量的查询参数突出显示活动 link

Highlighting active link with arbitrary number of query parameters

ihp