如何使用Laravel 5.2在Laravel 5.2中使用Bootstrap高亮當前頁面

Question

。並需要突出顯示與bootstarp的當前頁面鏈接。這是我的菜單刀片文件

<div class="collapse navbar-collapse" id="app-navbar-collapse"> 
       <!-- Left Side Of Navbar --> 
       <ul class="nav navbar-nav"> 
        <li ><a href="{{ url('/home') }}">Home</a></li> //menu 

        <li ><a href="{{ url('/help') }}">Help</a></li> //menu 

       </ul> 

       <!-- Right Side Of Navbar --> 
       <ul class="nav navbar-nav navbar-right"> 
        <!-- Authentication Links --> 
        @if (Auth::guest()) 
         <li><a href="{{ url('/login') }}">Login</a></li> 
         <li><a href="{{ url('/register') }}">Register</a></li> 
        @else 
         <li class="dropdown"> 

          <li> <a href="{{ route('projects.index') }}">Projects</a> </li> //menu 



          <li> <a href="{{ route('collaborators.index') }}">Collaborators</a> </li> //menu 

我該怎麼辦？我需要簡單的一個

Answer 1

您可以在您的視圖文件變量是這樣的：

{{--*/ $nav = 'user' /*--}} 

，然後在佈局檢查這個變量：

<li class="@if ($nav == 'user') active @endif"> 

當然，並添加CSS聲明的。活性。

Answer 2

從控制器傳遞變量$page。因此，如果控制器方法是頁面 '家'，那麼：

function about(){ 
    $page = 'home'; 
    //rest of your code 
} 

，並在您的視圖：

<li ><a href="{{ url('/home') }}" class="@if ($page == 'home') active @endif">Home</a></li> 

，並在你的CSS：

a.active: { 
color: red; 
} 

Answer 3

您可以定義CSS類並將類應用於當前網址，

<li class="{{ Request::is('home') ? 'active' : '' }}"> 

更新：

由於使用的是單頁的應用程序這會爲你工作，

$("ul li").click(function() { 
    $('li').removeClass("active"); 
    $(this).addClass("active"); 
}); 

Answer 4

走到這個地步

// It adds an active class when the url matches "users*" 
// The * means that it doesn't matter what comes after it 
<li class="{{ Request::is('users*') ? 'active' : '' }}"> 
    <a href="{{ route('users.index') }}">Employees</a> 
</li>