Listen to sibling Livewire events

In Livewire (sender)

$this->dispatch('hide-preloader', data: 'anything');

This creates a browser event:

hide-preloader

Livewire automatically converts it to:

hide-preloader


Option A — Alpine listening globally (recommended)

<div x-data> <script> window.addEventListener('hide-preloader', e => { console.log('Received from sibling:', e.detail.data); // your code here }); </script> </div>

This works from anywhere in the page.


Option B — Livewire global listener (NOT $wire)

Use Livewire’s global event system:

Livewire.on('hide-preloader', e => { console.log('event from sibling', e); });

With once:

Livewire.on('hide-preloader', e => { console.log(e); }, { once: true });

✔ This will catch events from any Livewire component.


Posted

in

by

Tags:

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *