Laravel and Livewire conflict, Livewire wire:click don't work in Laravel 8

Updated: Feb 06, 2025

Laravel and Livewire conflict, Livewire wire:click don't work in Laravel 8

When using Laravel 8 and Livewire together, you might encounter an issue where Livewire's wire:click event binding doesn't work as expected. This problem can be caused by a few different things, and in this answer, we'll go through some possible solutions to help you get your wire:click events working again.

First, let's make sure that you have installed both Laravel and Livewire correctly. To use Livewire with Laravel, you need to install it via composer:

composer require livewire/livewire

After installing Livewire, you should also register the Livewire service provider in your app/Providers/AppServiceProvider.php file:

use Livewire\Livewire;

class AppServiceProvider
{
    public function boot()
    {
        Livewire::component('components.example');
    }
}

Now, let's address the issue with wire:click not working. One possible cause is that you might be using an outdated version of Livewire. Make sure that you have the latest version installed by running:

composer update livewire/livewire

Another potential issue is that you might be using Laravel's default blade rendering engine instead of Livewire's. Livewire uses a different rendering engine, and if you're not using it, your wire:click events might not work. To use Livewire's rendering engine, make sure that you have the following line in your web.php file:

Route::middleware([
    Livewire\Livewire::class,
])->middlewareGroup('web');

If you're still experiencing issues, you might want to try disabling Laravel's event dispatcher cache. You can do this by adding the following line to your .env file:

APP_EVENTS_DISABLE_CACHE=true

Finally, if none of the above solutions work, you might want to consider using a different event binding method in Livewire, such as wire:event. Here's an example of how to use wire:event instead of wire:click:

<button wire:event="click">
    Click me!
</button>

<script>
    document.querySelector('button').addEventListener('click', () => {
        @this.click();
    });
</script>

In this example, we're using JavaScript to listen for the click event on the button and then calling the corresponding Livewire method click().

I hope this answer helps you get your wire:click events working again in Laravel 8 with Livewire. If you have any further questions or encounter any other issues, feel free to ask in the comments below.