首页 > 解决方案 > NextJS 路由器使用嵌套页面未设置活动菜单

问题描述

我正在使用 NextJS,我正在尝试使用路由器设置活动菜单项。所有“顶级”页面都可以正常工作,但如果顶级页面下有页面,则不会设置活动页面。

router.pathname == "/profile" ? "active" : "not active"

上面的代码设置为活动,/profile但如果例如我有一个页面/profile/23543456,那么它设置为不活动

有没有办法解决这个问题,以便配置文件的任何子页面也设置为活动状态?

标签: javascriptreactjsnext.js

解决方案


路径名字段包含完整的路由路径。所以在你的情况下,router.pathname/profile/23543456。您可以检查路径名是否以开头/profile/

router.pathname.startsWith('/profile/') ? "active" : "not active"

推荐阅读