05 - Edit Form: Pass Parameters to Component

Text Version of the Lesson

It's time to create the form to edit the company and pass the parameter from the URL to the Livewire component.

Company ID: From URL to Livewire

Imagine we have a URL /companies/1/edit, and our resourceful Controller looks like this.

app/Http/Controllers/CompanyController.php:

namespace App\Http\Controllers;
 
use App\Models\Company;
 
class CompanyController extends Controller
{
    public function create()
    {
        return view('companies.create');
    }
 
    public function edit(Company $company) 
    { 
        return view('companies.edit', compact('company', 'countries')); 
    } 
}

We get the $company with Laravel's Route Model Binding.

Now, the question is: in the Blade file, how do we pass the parameter to the Livewire component?

I've created a new edit.blade.php, almost copy-pasting everything from the create.blade.php. I know it's a code duplication, but we will optimize this when discussing full-page components and layouts in the upcoming lessons.

Here's the syntax.

resources/views/companies/edit.blade.php:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Simple Form</title>
    <script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="flex items-center justify-center min-h-screen bg-gray-100">
    <livewire:company-edit :company="$company" />
</body>
</html>

See that line?

<livewire:company-edit :company="$company" />

So yeah, we will create a new Livewire component:

php artisan make:livewire CompanyEdit

We can pass parameters with the syntax...

The Full Lesson is Only for Premium Members

Want to access all of our courses? (36 h 00 min)

You also get:

61 courses

Premium tutorials

Access to repositories

Private Discord

Get Premium for $129/year or $29/month

Already a member? Login here