Ссылки на страницы в Livewire

Давайте разберём такой случай. В базе постов много, а на экране видна только первая пара. До остальных с этой страницы не добраться: номеров страниц нет, и человек не понимает, что записи ещё есть.

Метод links у постраничного результата рисует номера страниц в шаблоне. Трейт WithPagination нужен и здесь: без него клик по номеру перезагрузит весь сайт, а не только список.

Пусть в проекте есть модель Post с полями заголовка и текста.

Давайте создадим компонент PostPager:

php artisan make:livewire PostPager --class

Давайте добавим маршрут и страницу:

<?php
	Route::get('/posts', function () {
		return view('posts');
	});
?>

<x-layout>
	<livewire:post-pager />
</x-layout>

Давайте в классе подключим трейт и снова возьмём по две записи:

<?php
	namespace App\Livewire;
	
	use App\Models\Post;
	use Livewire\Component;
	use Livewire\WithPagination;
	
	class PostPager extends Component
	{
		use WithPagination;
		
		public function render()
		{
			$posts = Post::orderBy('id')
				->paginate(2);
			
			return view(
				'livewire.post-pager',
				compact('posts')
			);
		}
	}
?>

Давайте под списком выведем номера страниц:

<div>
	@foreach ($posts as $post)
		<div wire:key="{{ $post->id }}">
			{{ $post->title }}
		</div>
	@endforeach
	{{ $posts->links() }}
</div>

Создайте компонент EmployeePager. Под списком работников должны быть номера страниц, и переход по ним не перезагружает весь сайт.