Livewire 2.x 遅延ローディング

Livewireは、コンポーネントがレンダーリングされるとすぐにアクションを実行するwire:initディレクティブを提供しています。これはページ全体の読み込みは待ちたくないが、ページ読み込み直後に一部のデータを読み込みたい場合に役立ちます。

class ShowPost extends Component
{
    public $readyToLoad = false;

    public function loadPosts()
    {
        $this->readyToLoad = true;
    }

    public function render()
    {
        return view('livewire.show-posts', [
            'posts' => $this->readyToLoad
                ? Post::all()
                : [],
        ]);
    }
}

<div wire:init="loadPosts">
    <ul>
        @foreach ($posts as $post)
            <li>{{ $post->title }}</li>
        @endforeach
    </ul>
</div>

loadPostsアクションは、Livewireコンポーネントがページでレンダーされた直後に実行されます。