Событие только отправителю в Livewire

Пусть кнопка стоит в одном блоке, и после нажатия должно измениться только его число. Рядом другой блок ждёт то же сообщение. Если сообщить всем, он тоже откликнется, хотя кнопку нажали не у него.

У dispatch есть вызов to, который оставляет событие у отправителя. Сосед с тем же атрибутом On останется без изменений.

Давайте соберём страницу /meter с Meter и Watcher:

php artisan make:livewire Meter --class
php artisan make:livewire Watcher --class

Давайте добавим маршрут:

<?php
	Route::get('/meter', function () {
		return view('meter');
	});
?>

Страница вставит оба компонента:

<x-layout>
	<livewire:meter />
	<livewire:watcher />
</x-layout>

Оба класса слушают tick и увеличивают своё число:

<?php
	namespace App\Livewire;
	
	use Livewire\Attributes\On;
	use Livewire\Component;
	
	class Meter extends Component
	{
		public $num = 0;
		
		public function tick()
		{
			$this->dispatch('tick')->to(self: true);
		}
		
		#[On('tick')]
		public function step()
		{
			$this->num++;
		}
		
		public function render()
		{
			return view('livewire.meter');
		}
	}
?>

Кнопка вызывает отправку:

<div>
	{{ $num }}
	<button type="button" wire:click="tick">
		Tick
	</button>
</div>

Сосед только слушает и не шлёт событие:

<?php
	namespace App\Livewire;
	
	use Livewire\Attributes\On;
	use Livewire\Component;
	
	class Watcher extends Component
	{
		public $num = 0;
		
		#[On('tick')]
		public function step()
		{
			$this->num++;
		}
		
		public function render()
		{
			return view('livewire.watcher');
		}
	}
?>

Он показывает своё число:

<div>
	{{ $num }}
</div>

Создайте компоненты Ticker и Lamp. На событие с Ticker должен отреагировать только он.