ItSolutionStuff.com

wire:current | Add Style on Current Active Link in Laravel Livewire 3 | EP 15

By Hardik Savani • February 11, 2025
Laravel Laravel Livewire

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:

Output:

I hope it can help you...

Hardik Savani

Hardik Savani

I'm a full-stack developer, entrepreneur, and founder of ItSolutionStuff.com. Passionate about PHP, Laravel, JavaScript, and helping developers grow.

📺 Subscribe on YouTube

We Are Recommending You

wire:loading | Add Loading Spinner in Laravel Livewire 3 | EP 13

Read Now →

wire:model | Bind Form Input in Laravel Livewire 3 | EP 12

Read Now →

wire:submit | Form Submit Event in Laravel Livewire 3 | EP 11

Read Now →

wire:click | Click Event in Laravel Livewire 3 | EP 10

Read Now →

Query String in Laravel Livewire 3 | EP 9

Read Now →

Basic Search using Laravel Livewire 3 | EP 8

Read Now →

Pagination using Laravel Livewire 3 | EP 7

Read Now →

Download File in Laravel Livewire 3 | EP 6

Read Now →

Redirect URL or Route in Laravel Livewire 3 | EP 5

Read Now →

Session Flash Messages in Laravel Livewire 3 | EP 4

Read Now →

File Uploading Laravel Livewire 3 | EP 3

Read Now →