How To Reset File input using livewire - laravel

Question

does anybody knows how to reset my input type="file". I'm been using the $this->reset() to clear the property of the input type="file".
$this->reset(['type', 'name', 'institution', 'year', 'certification']);

Answer 1

If you don't need to use id for any other purposes you can render the input like this:
<input type="file" id="{{ rand() }}" >
Instead of using rand() you can also use some kind of counter or any other value that will change on every render. Different id will force livewire to completely replace the element with new one, thus empty. Just setting value="" won't help as input type="file" is immutable. This solution is taken from here

Answer 2

Here is a solution I found in TALL Stack Tips to remove filename from input field after uploading via Livewire.
https://talltips.novate.co.uk/livewire/livewire-file-uploads-using-s3#removing-filename-from-input-field-after-upload
The solution involves implementing a counter to regulate the input file id

Answer 3

To reset a file input in livewire I removed id from that input. And assign a null value to the value.
input without id
<label>Upload Image
<input type="file" wire:model="image" class="w-full">
</label>
to assign null value
$this->image = null;

Answer 4

input create two wire(wire:click and wire:model), It works.
livewire：
<input wire:click="fileClear('fileName')" wire:model="fileName" type="file" id="fileName" name="fileName" >
class:
public function fileClear($inputId)
{
$this->$inputId = "";
}

Answer 5

Clearing #AlexYokisama answer
Yes the easy way is using id as the following.
<input type="file" id="{{ $rand }}" >
And then in you livewire component you need to declare this public $rand
And you can use it safely in your reset function.
public $rand;
public function resetForm()
{
$this->rand++;
}