Блог

Я хочу добавить пользовательский активный класс в боковое меню с текущим маршрутом. Я знаю, что могу получить текущий URL url()->current() -адрес и сравнить его с route('something') ним, но моя проблема заключается в том, что я хочу получить активный класс как в родительском, так и в дочернем пункте меню, когда выбран дочерний элемент.

Мой код для элемента меню без дочерних элементов:

 <li class=" @if(url()->current()==route('home')) custom_active_menu @endif ">
  

вы можете использовать if с несколькими операторами or для родительского элемента. я использую Request класс в целом, чтобы я мог использовать шаблон только со звездочкой вместо множественного оператора or . однако вы можете использовать все, что пожелаете. пример с использованием Request класса

 <li class="{{ Request::is('menu/*') || Request::is('menu') ? 'active' : ''  }}">
    <a href="#">
        <i class="metismenu-icon pe-7s-bandaid"></i>
        Menu
        <i class="metismenu-state-icon pe-7s-angle-down caret-left"></i>
    </a>
    <ul>
        <li>
            <a href="{{ route('menu.index') }}" class="{{ Request::is('menu') ? 'active' : ''  }}">
                <i class="metismenu-icon"></i>
                Menu Index
            </a>
        </li>
                        
        <li>
            <a href="{{ route('menu.create') }}" class="{{ Request::is('menu/create') ? 'active' : ''  }}">
                <i class="metismenu-icon"></i>
                Menu Create
            </a>
        </li>
    </ul>
</li>
  

здесь я проверяю шаблон в URL-адресе запроса, используя Request::is('menu/*') , что означает, что он li всегда будет активен, если URL-адрес запроса соответствует любому шаблону, начинающемуся с menu/ like menu/create или menu/1/edit . с помощью оператора or я проверяю точный URL-адрес запроса menu .

с дочерним элементом это просто простой оператор if. если текущий URL-адрес совпадает с URL-адресом меню, добавьте класс active.

в вашем примере я бы сделал что-то вроде для parent

 <li class=" @if (url()->current() == route('home') || url()->current() == route('another_route')) custom_active_menu @endif ">
  

и для дочернего элемента только один if

 <li class=" @if (url()->current() == route('home')) custom_active_menu @endif ">