How do I hide something when a validation runs in Laravel Blade using Livewire?

Question

I have an input type of file in my Laravel blade, I also have validation of image|max:1024 in the livewire. The problem is the input validates but it errors me out because the Laravel Blade displays the img that is not a file type of image so I want to hide it when it doesn't reach the validation.

    <div class="pb-2">
        @if ($header_image)
            @error('header_image')
                <span class="error">{{ $message }}</span>
            @enderror
            <img src="{{ $header_image->temporaryUrl() }}" height="30%" width='50%'>
        @else
            <img src="{{url('storage/photos/'.$banner->header_image)}}" height="30%" width='50%' />
        @endif
    </div>

I want to hide the one with the temporaryUrl() .

Answer 1

You can use this validator approach to to any action on fails

$validation = Validator::make($data,$rules);
if($validation->fails()) {
   $this->property = null;
}