Livewire Layout Components Pattern

Create reusable layout components for Livewire pages.

Layout components:

Define Layout

#[Layout('layouts.app')]
class Dashboard extends Component
{
    public function render()
    {
        return view('livewire.dashboard');
    }
}

blade

<!-- layouts/app.blade.php -->
<html>
<body>
    <nav>...</nav>
    {{ $slot }}
    <footer>...</footer>
</body>
</html>

#[Layout('layouts.app')]
#[Title('Dashboard')]
class Dashboard extends Component {}

php

public function render()
{
    return view('livewire.post')
        ->title($this->post->title);
}