Tengo un menú de navegación con boostrap, uso el motor de plantillas blade y tengo jquery +boostrap 4 en el layout.
El header que tengo es este
<nav class="nav-menu d-none d-lg-block">
<ul>
<li><a id="home" href="{{ route('front.user.pages.home') }}">Inicio</a></li>
<li><a id="perfil-usuario" href="{{ route('front.user.profile.show') }}">Perfil usuario</a></li>
</ul>
</nav><!-- .nav-menu -->
<a href="#about" class="get-started-btn scrollto">Empieza ya!</a>
</div>
Y lo que intento hacer es que cuando el usuario haga click en cada uno de los botones como puede ser "Inicio" o "Perfil usuario" que no deja de ser un link a una ruta, cuando cargue la página deje el botón marcado como tal.
La única forma que lo he conseguido que seguramente sea la "peor" en cuanto a mantenimiento es mirando la "URI" que recibo y si la uri coincide con algunos de los botones, mediante jquery le añado la clase "active"
Algo asi.
@php
if ($_SERVER['REQUEST_URI'] === '/perfil-usuario') {
$("#perfil-usuario").addClass("active");
}
@endphp
url()->current()
, ej.route('front.user.pages.home') === url()->current() ? 'active' : ''
... lo puedes meter en una función etc....