Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

wellresponsive's avatar

Boostrap Dropdowns stop working using Lravel Livewire and wire:navigate

Hello everyone , I'm using Livewire components integrated with the botstrap 5.3 navbar. Everything works fine but, when I use wire:navigate to the links in the navbar, all interactive elements stop working. Moreover there are no errors in the console. navbar toggle dropdowns, stops working.

here's the dropdown menu example

  <ul class="dropdown-menu">
    <li><a class="dropdown-item" href="{{route('home')}}" wire:navigate>Home</a></li>
    <li><a class="dropdown-item" href="{{route('about')}}" wire:navigate>About</a></li>
    <li><a class="dropdown-item" href="{{route('contacts')}}" wire:navigate>Contacts</a></li>
  </ul>~~~

i've been searching for a solution but none of them worked for me , any help please , on how to solve the issue and get things work correctly
0 likes
1 reply
askphantom's avatar

Add data-navigate-once to your Bootstrap JS. It works for me

<script data-navigate-once src="bootstrap.js"></script>

Please or to participate in this conversation.