Livewire image uploading returns with the error "Image must be an image"?

  laravel, laravel-livewire

Using livewire to control a form with some fields and image uploading capability

   <form enctype="multipart/form-data" class="flex justify-center" wire:submit.prevent="upload">
     <input accept="image/*" wire:model="image.image" type="file"
            class="w-full h-full opacity-0 cursor-pointer" name="upload">
   </form
use AppModelsAnimal;
use AppModelsImage;
use LivewireComponent;
use LivewireWithFileUploads;

class AddAnimal extends Component
{
    use WithFileUploads;

    public Animal $animal;
    public Image $image;

    protected array $rules = [
        'animal.name' => 'required|min:2',
        'animal.eye_color_id' => 'nullable',
        'animal.bio' => 'nullable',
        'animal.breeds_id' => 'nullable',
        'animal.genders_id' => 'nullable',
        'animal.breeders_id' => 'nullable',
        'animal.chip_number' => 'nullable',
        'animal.passport_url' => 'nullable',
        'image.image' => 'image|max:1024',
    ];

    public function mount()
    {
        $this->animal = new Animal();
        $this->image = new Image();
    }

    public function render()
    {
        return view('livewire.add-animal')
    }

    public function upload()
    {
        $this->validate();

        $this->animal->save();

        $this->image->store('photos');
    }

Upload function gets called and the animal is being saved correctly to the database, but the image throws an error saying "The image must be an image" , but it is an image ?

Source: Laravel

Leave a Reply