wire:current | Add Style on Current Active Link in Laravel Livewire 3 | EP 15
In this post, I will show you how to use wire current with wire:navigate html directive with laravel livewire 3.
The wire:current directive makes it easy to detect and style the active links on a page. In this example, We will use the `wire:current` directive to add an active class based on the URL. It will highlight the current menu item. This makes it easy to add the active class automatically. let's see the example:
resources/views/theme/default.blade.php
<nav>
<a href="/" wire:current="active" wire:navigate>Dashboard</a>
<a href="/posts" wire:current="active" wire:navigate>Posts</a>
<a href="/users" wire:current="active" wire:navigate>Users</a>
</nav>
Run Laravel:
All the required steps have been done, now you have to type the given below command and hit enter to run the Laravel app:
php artisan serve
Now, Go to your web browser, type the given URL and view the app output:
http://localhost:8000/
Now, you need to register user and go to dashboard:
I hope it can help you...
Hardik Savani
I'm a full-stack developer, entrepreneur and owner of ItSolutionstuff.com. I live in India and I love to write tutorials and tips that can help to other artisan. I am a big fan of PHP, Laravel, Angular, Vue, Node, Javascript, JQuery, Codeigniter and Bootstrap from the early stage. I believe in Hardworking and Consistency.
We are Recommending you
- wire:loading | Add Loading Spinner in Laravel Livewire 3 | EP 13
- wire:model | Bind Form Input in Laravel Livewire 3 | EP 12
- wire:submit | Form Submit Event in Laravel Livewire 3 | EP 11
- wire:click | Click Event in Laravel Livewire 3 | EP 10
- Query String in Laravel Livewire 3 | EP 9
- Basic Search using Laravel Livewire 3 | EP 8
- Pagination using Laravel Livewire 3 | EP 7
- Download File in Laravel Livewire 3 | EP 6
- Redirect URL or Route in Laravel Livewire 3 | EP 5
- Session Flash Messages in Laravel Livewire 3 | EP 4
- File Uploading Laravel Livewire 3 | EP 3