Метод setPage

Метод setPage класса WithPagination устанавливает текущую страницу пагинации в компоненте Livewire. В параметр передаётся номер страницы. После вызова метода Livewire автоматически обновляет шаблон компонента и отображает данные с новой страницы.

Синтаксис

<?php
	$this->setPage($page);
?>

Пример

Создадим компонент со списком элементов. Установим вторую страницу пагинации при загрузке:

<?php
	namespace AppLivewire;
	
	use LivewireComponent;
	use LivewireWithPagination;
	use AppModelsItem;
	
	class ItemList extends Component
	{
		use WithPagination;
		
		public function render()
		{
			$items = Item::paginate(10);
			
			return view('livewire.item-list', [
				'items' => $items
			]);
		}
	}
?>

<div>
	@php
		$this->setPage(2);
	@endphp
	
	<ul>
		@foreach ($items as $item)
			<li>{{ $item->id }}. {{ $item->name }}</li>
		@endforeach
	</ul>
	
	{{ $items->links() }}
</div>

Результат выполнения кода:

<ul>
	<li>11. Item 11</li>
	<li>12. Item 12</li>
	<li>13. Item 13</li>
	<li>14. Item 14</li>
	<li>15. Item 15</li>
	<li>16. Item 16</li>
	<li>17. Item 17</li>
	<li>18. Item 18</li>
	<li>19. Item 19</li>
	<li>20. Item 20</li>
</ul>
<nav>
	<ul>
		<li>1</li>
		<li>2</li>
		<li>3</li>
	</ul>
</nav>

Пример

Давайте установим новую страницу по клику на кнопку:

<?php
	namespace AppLivewire;
	
	use LivewireComponent;
	use LivewireWithPagination;
	use AppModelsItem;
	
	class ItemList extends Component
	{
		use WithPagination;
		
		public function goToPage($page)
		{
			$this->setPage($page);
		}
		
		public function render()
		{
			$items = Item::paginate(10);
			
			return view('livewire.item-list', [
				'items' => $items
			]);
		}
	}
?>

<div>
	<button wire:click="goToPage(3)">Go to page 3</button>
	
	<ul>
		@foreach ($items as $item)
			<li>{{ $item->id }}. {{ $item->name }}</li>
		@endforeach
	</ul>
	
	{{ $items->links() }}
</div>

Результат выполнения кода после клика на кнопку:

<button>Go to page 3</button>
<ul>
	<li>21. Item 21</li>
	<li>22. Item 22</li>
	<li>23. Item 23</li>
	<li>24. Item 24</li>
	<li>25. Item 25</li>
	<li>26. Item 26</li>
	<li>27. Item 27</li>
	<li>28. Item 28</li>
	<li>29. Item 29</li>
	<li>30. Item 30</li>
</ul>
<nav>
	<ul>
		<li>1</li>
		<li>2</li>
		<li>3</li>
	</ul>
</nav>

Смотрите также

метод resetPage,
который сбрасывает страницу к первой
метод nextPage,
который переключает на следующую страницу
метод previousPage,
который переключает на предыдущую страницу
класс WithPagination,
который добавляет функциональность пагинации