reset Component
Метод reset класса Component предназначен для сброса публичных свойств компонента Livewire к их исходным значениям, заданным при объявлении свойства. В метод передается список имен свойств, которые необходимо сбросить. Это особенно удобно при обработке форм, когда после успешной отправки требуется очистить все поля ввода.
Метод принимает переменное количество аргументов - строковые имена свойств, которые нужно сбросить. Если не передать ни одного аргумента, метод не выполнит никаких действий.
Синтаксис
<?php
$this->reset('property1', 'property2', ...);
?>
Пример
Давайте создадим форму с полями ввода и сбросим их значения после отправки:
<?php
namespace AppLivewire;
use LivewireComponent;
class UserForm extends Component
{
public $name = '';
public $email = '';
public $age = 0;
public function save()
{
// Логика сохранения данных
// Сброс всех полей формы
$this->reset('name', 'email', 'age');
}
public function render()
{
return view('livewire.user-form');
}
}
?>
<form wire:submit="save">
<input type="text" wire:model="name" placeholder="Name">
<input type="email" wire:model="email" placeholder="Email">
<input type="number" wire:model="age" placeholder="Age">
<button type="submit">Save</button>
</form>
После нажатия на кнопку отправки все поля будут очищены, так как свойства $name, $email и $age сбрасываются к значениям по умолчанию.
Пример
Сбросим только часть свойств, оставив остальные без изменений:
<?php
namespace AppLivewire;
use LivewireComponent;
class PartialReset extends Component
{
public $title = 'Default Title';
public $content = 'Default Content';
public $status = 'draft';
public function resetContent()
{
// Сбрасываем только поля title и content
$this->reset('title', 'content');
}
public function render()
{
return view('livewire.partial-reset');
}
}
?>
<div>
<h2>{{ $title }}</h2>
<p>{{ $content }}</p>
<span>Status: {{ $status }}</span>
<button wire:click="resetContent">Reset Title and Content</button>
</div>
При нажатии на кнопку свойства $title и $content вернутся к исходным значениям, а свойство $status останется неизменным.
Пример
Сброс свойств после валидации формы с выводом сообщения об успехе:
<?php
namespace AppLivewire;
use LivewireComponent;
class ContactForm extends Component
{
public $name = '';
public $message = '';
public $success = false;
protected $rules = [
'name' => 'required|min:2',
'message' => 'required|min:5',
];
public function submit()
{
$this->validate();
// Логика отправки сообщения
$this->success = true;
$this->reset('name', 'message');
}
public function render()
{
return view('livewire.contact-form');
}
}
?>
<form wire:submit="submit">
<input type="text" wire:model="name" placeholder="Your name">
@error('name') <span>{{ $message }}</span> @enderror
<textarea wire:model="message" placeholder="Your message"></textarea>
@error('message') <span>{{ $message }}</span> @enderror
<button type="submit">Send</button>
@if($success)
<div>Message sent successfully!</div>
@endif
</form>
После успешной отправки форма очищается, а свойство $success остается true для отображения сообщения об успехе.