Отложенная привязка при вводе в Livewire

Привязка с .live обновляет заголовок на каждую букву, и запросы уходят один за другим. Пока человек печатает быстро, промежуточные значения на экране почти не успевают пригодиться. Нужен текст во время набора, но без обращения к серверу на каждый символ.

Модификатор .debounce ждёт паузу во вводе и только потом отправляет обновление. Его можно совместить с .live и указать задержку в 500 миллисекунд.

Давайте заведём в PostForm свойство заголовка:

<?php
	namespace App\Livewire;
	
	use Livewire\Component;
	
	class PostForm extends Component
	{
		public $title = '';
		
		public function render()
		{
			return view('livewire.post-form');
		}
	}
?>

В шаблоне повесим на поле заголовка привязку с паузой 500 мс и выведем значение под ним:

<div>
	<input type="text" wire:model.live.debounce.500ms="title">
	<div>{{ $title }}</div>
</div>

Сделайте так, чтобы имя работника обновлялось во время ввода, но не на каждую букву.