DEV Community

Cover image for How to Redirect URL or Route using Laravel Livewire 3
Msh Sayket
Msh Sayket

Posted on

1

How to Redirect URL or Route using Laravel Livewire 3

In this post, I will show How to Redirect URL or Route using Laravel Livewire 3.

In this example, we will create a PhotoUpload Livewire component. This component will feature a form with a file input field and include image validation. The user can select an image, which will then be uploaded to the storage folder using the WithFileUploads trait. After upload image we will redirect route with flash message. You Can Learn How To Session Flash Messages in Laravel Livewire 3

How to Redirect URL or Route using Laravel Livewire 3 Example

Step 1: Create PhotoUpload Component

Now here we will create a Livewire component using their command. So run the following command to create an add more component.
php artisan make:livewire PhotoUpload
Now they created files on both paths:

app/Livewire/PhotoUpload.php

resources/views/livewire/photo-upload.blade.php
Enter fullscreen mode Exit fullscreen mode

Now, both files we will update as below for our contact us form.

app/Livewire/PhotoUpload.php

<?php

namespace App\Livewire;

use Livewire\Component;
use Livewire\WithFileUploads;
use App\Models\Image;

class PhotoUpload extends Component
{
    use WithFileUploads;

    public $photo;

    public function render()
    {
        return view('livewire.photo-upload');
    }

    public function submit(){
        $this->validate([
            "photo" => "required|image"
        ]);

        $filepath = $this->photo->store("photos");

        $image = Image::create([
            "title" => "Test",
            "filepath" => $filepath
        ]);

        session()->flash("success", "Image uploaded successfully");

        return redirect()->route("home");
    }
}
Enter fullscreen mode Exit fullscreen mode

Read More

Image of Datadog

Master Mobile Monitoring for iOS Apps

Monitor your app’s health with real-time insights into crash-free rates, start times, and more. Optimize performance and prevent user churn by addressing critical issues like app hangs, and ANRs. Learn how to keep your iOS app running smoothly across all devices by downloading this eBook.

Get The eBook

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay