Проверка файла в Livewire

Давайте разберём такой случай. В поле картинки поста можно положить документ или очень большой файл, и страница его спокойно примет. Плохой файл попадёт в папку или сломает вёрстку уже после сохранения.

Перед записью на диск вызывают метод validate с правилами для свойства файла: так можно требовать именно картинку и ограничить размер. В нашем примере принимается только изображение не больше мегабайта.

Давайте создадим компонент PostCheck:

php artisan make:livewire PostCheck --class

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

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

<x-layout>
	<livewire:post-check />
</x-layout>

Давайте в методе save сначала проверим файл, затем сохраним его:

<?php
	namespace App\Livewire;
	
	use Livewire\Component;
	use Livewire\WithFileUploads;
	
	class PostCheck extends Component
	{
		use WithFileUploads;
		
		public $photo;
		public $path = '';
		
		public function save()
		{
			$this->validate([
				'photo' => 'image|max:1024',
			]);
			
			$this->path = $this->photo
				->store(path: 'photos');
		}
		
		public function render()
		{
			return view(
				'livewire.post-check'
			);
		}
	}
?>

Давайте в шаблоне оформим форму и вывод ошибки:

<div>
	<form wire:submit="save">
		<input
			type="file"
			wire:model="photo"
		>
		@error('photo')
			<div>{{ $message }}</div>
		@enderror
		<button type="submit">
			Save
		</button>
	</form>
	{{ $path }}
</div>

Создайте компонент EmployeeCheck. Файл работника принимается только если это картинка не больше мегабайта, иначе под полем видно сообщение.