Метод hydrate
Метод hydrate вызывается в жизненном цикле компонента Livewire
сразу после того, как состояние компонента было восстановлено
из сохраненных данных (дегидратированных). Это происходит при каждом
последующем запросе к компоненту, после метода mount
(при первом рендеринге) или вместо него (при последующих).
Метод полезен для инициализации свойств на основе сохраненного состояния
или выполнения побочных действий перед обработкой запроса.
Синтаксис
<?php
namespace AppLivewire;
use LivewireComponent;
class Example extends Component
{
public function hydrate()
{
// Действия после восстановления состояния
}
public function render()
{
return view('livewire.example');
}
}
?>
Пример
Пусть компонент хранит массив и дату последнего обновления. Восстановим дату из сохраненного состояния:
<?php
namespace AppLivewire;
use LivewireComponent;
class PostList extends Component
{
public $posts = ['article', 'user', 'category'];
public $updatedAt = null;
public function hydrate()
{
if ($this->updatedAt) {
// Восстановление формата даты
$this->updatedAt = date('H:i:s', strtotime($this->updatedAt));
}
}
public function refresh()
{
$this->posts[] = 'new post';
$this->updatedAt = date('Y-m-d H:i:s');
}
public function render()
{
return view('livewire.post-list');
}
}
?>
<div>
<button wire:click="refresh">
Добавить пост
</button>
<p>
Обновлено: {{ $updatedAt }}
</p>
<ul>
@foreach ($posts as $post)
<li>{{ $post }}</li>
@endforeach
</ul>
</div>
Результат выполнения кода:
<div>
<button>
Добавить пост
</button>
<p>
Обновлено: 14:25:30
</p>
<ul>
<li>article</li>
<li>user</li>
<li>category</li>
<li>new post</li>
</ul>
</div>
Пример
Метод hydrate также может быть использован для
обновления зависимых свойств компонента:
<?php
namespace AppLivewire;
use LivewireComponent;
class Order extends Component
{
public $basePrice = 0;
public $discount = 0;
public $totalPrice = 0;
public function hydrate()
{
$this->totalPrice = $this->basePrice - $this->discount;
}
public function updatePrice($price)
{
$this->basePrice = $price;
}
public function render()
{
return view('livewire.order');
}
}
?>
<div>
<input type="number" wire:model="basePrice" />
<input type="number" wire:model="discount" />
<p>
Итоговая цена: {{ $totalPrice }}
</p>
</div>
Результат выполнения кода:
<div>
<input type="number" value="100" />
<input type="number" value="15" />
<p>
Итоговая цена: 85
</p>
</div>