Jadikan kelas aktif untuk induk dan sub di Laravel

Saya punya menu seperti ini:

<li class="treeview">
        <a href="/id#"><i class="fa fa-comment"></i> <span>Comments</span>
            <span class="pull-right-container">
                <i class="fa fa-angle-left pull-right"></i>
            </span>
        </a>
        <ul class="treeview-menu">
            <li><a href="http://blog.dev/member/comments">All Comments</a></li>
            <li><a href="http://blog.dev/member/comments?q=me">My Comments</a></li>
            <li><a href="http://blog.dev/member/comments?q=approved">Approved</a></li>
            <li><a href="http://blog.dev/member/comments?q=disapproved">Disapproved</a></li>
        </ul>
    </li>

Yang saya inginkan hanyalah ketika saya mengklik submenu misalnya menu "Komentar Saya", menu Komentar dan Komentar Saya yang aktif akan memiliki kelas seperti ini

    <li class="active"><a href="/id#"><i class="fa fa-comment"></i> <span>Comments</span></a></li>
    <li class="active active-sub"><a href="http://blog.dev/member/comments?q=me">My Comments</a></li>

jadi bagaimana saya bisa mewujudkannya? Terima kasih


laravel laravel-5 laravel-blade
person Ying    schedule 29.11.2017    source sumber

Jawaban (4)


arrow_upward
2
arrow_downward

Coba ini:

<li class="treeview {{ (request()->is('member/comments')) ? 'active':''  }}">
    <a href="/id#"><i class="fa fa-comment"></i> <span>Comments</span>
        <span class="pull-right-container">
            <i class="fa fa-angle-left pull-right"></i>
        </span>
    </a>
    <ul class="treeview-menu">
        <li class="{{ (request()->is('member/comments') && (request('q') == '')) ? 'active active-sub':''  }}">
            <a href="http://blog.dev/member/comments">All Comments</a>
        </li>
        <li class="{{ (request('q') == 'me') ? 'active active-sub':''  }}">
            <a href="http://blog.dev/member/comments?q=me">My Comments</a>
        </li>
        <li class="{{ (request('q') == 'approved') ? 'active active-sub':''  }}">
            <a href="http://blog.dev/member/comments?q=approved">Approved</a>
        </li>
        <li class="{{ (request('q') == 'disapproved') ? 'active active-sub':''  }}">
            <a href="http://blog.dev/member/comments?q=disapproved">Disapproved</a>
        </li>
    </ul>
</li>
person Rimon Khan    schedule 30.11.2017

arrow_upward
1
arrow_downward

Anda dapat menggunakan metode is() pada objek Request yang menerima pola untuk diperiksa. Misalnya <li class="{{ request()->is('comments*') ? 'active' : '' }}">. Artinya jika ada kata 'komentar' di suatu tempat di uri maka kelas 'aktif' akan ditambahkan. Tentu saja Anda bisa lebih spesifik dan menghilangkan wildcard.

person Jendrusha    schedule 29.11.2017

arrow_upward
0
arrow_downward

Penggunaan adalah metode dengan klausa if;

{{Request::is('sample-url') ? 'class="active"' : ''}}

(Periksa url, jika ada 'sampel-url' di url maka return class="active", tidak dikembalikan kosong.. )

person Community    schedule 30.11.2017
comment
Bisakah Anda membagikan tangkapan layar di file blade Anda? - person ; 30.11.2017

arrow_upward
0
arrow_downward

Anda dapat mencoba menggunakan paket ini https://www.hieule.info/products/laravel-active-version-3-released, ini menyediakan metode pembantu untuk memeriksa apakah rute saat ini sesuai dengan kondisi Anda.

Misalkan rute Anda diberi nama comments.index, comments.my_comments, dst.

<li class="{{ active_class(if_route('comments.*')) }}">
     <a href="/id#"><i class="fa fa-comment"></i> 
     <span>Comments</span></a>
</li>
person Paul Santos    schedule 30.11.2017