Livewire - File Uploads - Temporary Preview URL's Error - Serialization of 'Livewire\TemporaryUploadedFile' is not allowed

Viewed 39

I am creating multiple steps form with livewire. In the third step, I am uploading the image via livewire and also previewing the image on the image selected. After previewing the image, when I move to the first or second step it returns the error - [Serialization of 'Livewire\TemporaryUploadedFile' is not allowed] Please help me, with how I can solve this issue.

                                <div class="form-row pl-2 pr-2 reward-engagement mt-3">
                                    <div class="col-md-9 mb-3">
                                        <label for="validationDefault01"><small>UPLOAD IMAGE</small></label>
                                        <div class="input-group input-group-merge">
                                            <input type="file" class="form-control form-control-sm " id="amount5" wire:model="photo" />
                                        </div>
                                    </div>
                                    <div class="col-md-3 mt-4 mb-2 pt-1">
                                        <button type="button" class="btn btn-sm btn-success btn-icon" wire:click="mission_description"> <span>Continue</span> </button>
                                    </div>
                                </div>
                                <div wire:loading wire:target="photo">Uploading...</div>
                                @if($photo)
                                <img src="{{ $isUploaded ? $photo->temporaryUrl() : asset('public/'.$photo) }}" width="150" height="150">
                                @endif

ScreenShot:

Front View Screenshot

1 Answers
Related