Метод hook
Метод hook класса Livewire позволяет регистрировать
обработчики событий жизненного цикла компонента. Хуки выполняются
в определенные моменты: до или после обновления свойства,
перед рендерингом, при инициализации и других ключевых этапах.
В отличие от методов-хуков в самом компоненте (например, mount
или updated), метод hook дает возможность регистрировать
обработчики динамически, в том числе из сторонних сервисов или трейтов.
Метод hook принимает два параметра: имя хука и колбэк-функцию,
которая будет выполнена при наступлении соответствующего события.
Колбэк получает доступ к текущему экземпляру компонента через
замыкание или может быть передан как массив для метода сервиса.
Синтаксис
<?php
use Livewire\Livewire;
Livewire::hook('hookName', function ($component) {
// Код выполняется при наступлении хука
});
?>
Основные хуки
Рассмотрим основные хуки, доступные в Livewire:
<?php
// Выполняется перед рендерингом
Livewire::hook('render', function ($component) {
$component->beforeRender = true;
});
// Выполняется после обновления свойства
Livewire::hook('updated', function ($component, $property, $value) {
// Действие при обновлении любого свойства
});
// Выполняется при инициализации компонента
Livewire::hook('mount', function ($component, $params) {
// Инициализация данных
});
// Выполняется до обновления свойства
Livewire::hook('updating', function ($component, $property, $value) {
// Валидация перед обновлением
});
?>
Пример
Давайте зарегистрируем хук, который будет логировать
изменения свойства $num:
<?php
namespace App\Livewire;
use Livewire\Component;
use Livewire\Livewire;
use Illuminate\Support\Facades\Log;
class Counter extends Component
{
public $num = 0;
public function mount()
{
Livewire::hook('updated', function ($component, $property, $value) {
if ($property === 'num') {
Log::info("Counter updated to: " . $value);
}
});
}
public function inc()
{
$this->num++;
}
public function render()
{
return view('livewire.counter');
}
}
?>
<div>
<button wire:click="inc">+</button>
<span>{{ $num }}</span>
</div>
При каждом клике на кнопку значение свойства увеличивается, а в лог записывается информация об изменении.
Пример
Давайте используем хук updating для валидации
перед изменением свойства:
<?php
namespace App\Livewire;
use Livewire\Component;
use Livewire\Livewire;
class Form extends Component
{
public $age = 18;
public function mount()
{
Livewire::hook('updating', function ($component, $property, $value) {
if ($property === 'age' && $value < 18) {
throw new \Exception('Age must be 18 or older');
}
});
}
public function setAge($age)
{
$this->age = $age;
}
public function render()
{
return view('livewire.form');
}
}
?>
<div>
<input type="number" wire:change="setAge($event.target.value)" value="{{ $age }}">
<p>Age: {{ $age }}</p>
</div>
При попытке установить возраст меньше 18 лет будет выброшено исключение, и изменение свойства не произойдет.
Пример
Давайте зарегистрируем хук, который выполняется только для конкретного компонента:
<?php
namespace App\Livewire;
use Livewire\Component;
use Livewire\Livewire;
class SpecialCounter extends Component
{
public $counter = 0;
public function mount()
{
Livewire::hook('render', function ($component) {
if ($component instanceof SpecialCounter) {
$component->counter += 10;
}
});
}
public function render()
{
return view('livewire.special-counter');
}
}
?>
<div>
<span>Special counter: {{ $counter }}</span>
</div>
При рендеринге компонента значение $counter
автоматически увеличивается на 10 благодаря зарегистрированному хуку.
