html - 在具有母风格的菜单栏上选择按钮

Question

我使用的是 laravel，所以我在每个页面上都有一个“布局”或母风格。我有一个设计，当我在选定的页面上时，按钮会在该页面上突出显示，但是我无论如何都想不出在没有每个页面上的所有菜单的情况下使用一个单一的母亲风格来做到这一点，从而使母亲风格变得无用。任何解决方案？

<ul class="nav nav-pills nav-justified">
  <li role="presentation" class="active"><a class="green" href="{{URL::route('admin-manage-stock')}}"><span class="glyphicon glyphicon-tag" aria-hidden="true"></span> Stock</a></li>
  <li role="presentation"><a href="{{URL::route('admin-manage-portfolio')}}" class="orng"><span class="glyphicon glyphicon-briefcase" aria-hidden="true"></span> Portfolio</a></li>
  <li role="presentation"><a href="{{URL::route('admin-manage-gallery')}}" class="purpl"><span class="glyphicon glyphicon-picture" aria-hidden="true"></span> Gallery</a></li>
</ul>

您可以看到其中一个 Li 处于事件状态，使其突出显示。

Answer 1

由于您使用命名路由，您可以通过检查当前路由是否是链接所属的那个路由来轻松实现此目的

Route::currentRouteNamed('admin-manage-stock')

如果第一个链接应该是事件的，将返回 true。

<ul class="nav nav-pills nav-justified">
    <li role="presentation" @if(Route::currentRouteNamed('admin-manage-stock')) class="active" @endif>
        <a class="green" href="{{URL::route('admin-manage-stock')}}"><span class="glyphicon glyphicon-tag" aria-hidden="true"></span> Stock</a>
    </li>
    <li role="presentation" @if(Route::currentRouteNamed('admin-manage-portfolio')) class="active" @endif>
        <a href="{{URL::route('admin-manage-portfolio')}}" class="orng"><span class="glyphicon glyphicon-briefcase" aria-hidden="true"></span> Portfolio</a>
    </li>
    <li role="presentation" @if(Route::currentRouteNamed('admin-manage-gallery')) class="active" @endif>
        <a href="{{URL::route('admin-manage-gallery')}}" class="purpl"><span class="glyphicon glyphicon-picture" aria-hidden="true"></span> Gallery</a>
    </li>
</ul>