如何在ASP.NET的_Layout.cshtml中获取当前路由并设置导航样式?
解决_Layout.cshtml中根据路由设置导航选中类的问题
首先得说你原来的代码问题出在哪:你混用了ASP.NET Web Forms的<%= %>语法和Razor语法,而且在ASP.NET Core里,Url.RequestContext这种写法早就被淘汰了,这就是代码不生效的核心原因。
下面给你几个在没有页面模型的情况下,能正常工作的实用方案:
方案一:通过ViewContext获取当前路由页面
直接在Razor里用ViewContext.RouteData拿到当前页面的路由值,然后做判断:
<li> <a asp-page="/Notifications" class="@(ViewContext.RouteData.Values["page"]?.ToString() == "/Notifications" ? "selected-club" : "")"> <i class="fas fa-home"></i> Notifications </a> </li>
这里要注意,路由里的page值是带斜杠的完整路径(比如/Notifications),所以判断的时候要对应上。另外加了?.ToString()是防止page值为空时出现空引用异常。
方案二:利用PageContext(仅适用于Razor Pages项目)
如果你的项目是Razor Pages,可以直接用PageContext获取页面的路径信息,这个判断更精准:
<li> <a asp-page="/Notifications" class="@(PageContext.ActionDescriptor.RelativePath.Equals("/Notifications.cshtml", StringComparison.OrdinalIgnoreCase) ? "selected-club" : "")"> <i class="fas fa-home"></i> Notifications </a> </li>
这里的RelativePath是页面的实际文件路径,包含.cshtml后缀,所以判断的时候要写完整。用OrdinalIgnoreCase是为了忽略大小写,避免因为路径大小写不一致导致判断失败。
方案三:封装成辅助方法(更适合多导航项的场景)
如果导航栏有多个选项,重复写判断逻辑太麻烦,可以在_Layout.cshtml里定义一个局部辅助方法:
@functions { public string GetNavActiveClass(string targetPage) { var currentPage = ViewContext.RouteData.Values["page"]?.ToString(); return string.Equals(currentPage, targetPage, StringComparison.OrdinalIgnoreCase) ? "selected-club" : ""; } }
然后每个导航项直接调用这个方法就行,代码更简洁易维护:
<li> <a asp-page="/Notifications" class="@GetNavActiveClass("/Notifications")"> <i class="fas fa-home"></i> Notifications </a> </li> <li> <a asp-page="/Home" class="@GetNavActiveClass("/Home")"> <i class="fas fa-bell"></i> Home </a> </li>
这样不管是哪个导航项,都能轻松判断是否要添加选中类啦。
内容的提问来源于stack exchange,提问作者Martin Erlic
相关产品推荐
相关产品推荐

