Тонке налаштування пагінації в Laravel

Перекладено ШІ
Оригінал: Laravel News
Оновлено: 14 лютого, 2025
Вам цікаво дізнатися, як зробити навігацію по вашому контенту зручнішою? У нашій статті ми розглянемо, як метод onEachSide в Laravel дозволяє налаштувати кількість посилань на сторінки, адаптуючи інтерфейс під різні обсяги даних
Метод onEachSide у Laravel дозволяє регулювати кількість навігаційних посилань, відображених навколо поточної сторінки. Це забезпечує зручніший контроль над навігацією вашими наборами даних. Під час роботи ви можете налаштувати відображення посилань, замість того, щоб використовувати значення за замовчуванням, щоб відповідати потребам вашого застосунку. Ця функція особливо корисна для застосунків з різними обсягами даних, коли потрібно показати більше опцій навігації для більших наборів, але зберегти інтерфейс чистим для менших.
{{ $posts->onEachSide(3)->links() }}
Ось приклад реалізації адаптивної пагінації:
<?php

namespace App\Http\Controllers;

use App\Models\Article;
use Illuminate\Http\Request;

class ArticleController extends Controller
{
    public function index(Request $request)
    {
        $perPage = $this->determinePerPage($request);
        $articles = Article::latest()
            ->withCount('comments')
            ->paginate($perPage);
        // Налаштуйте видимі посилання залежно від загальної кількості сторінок
        $linksToShow = $this->calculateVisibleLinks($articles);

        return view('articles.index', [
            'articles' => $articles->onEachSide($linksToShow)
        ]);
    }

    private function determinePerPage(Request $request): int
    {
        return $request->query('show', 10);
    }

    private function calculateVisibleLinks($paginator): int
    {
        $totalPages = $paginator->lastPage();

        // Показати більше посилань для більших наборів даних
        return match(true) {
            $totalPages > 20 => 3,  // « 1 ... 4 5 6 7 8 9 10 ... 25 »
            $totalPages > 10 => 2,  // « 1 ... 4 5 6 7 8 ... 15 »
            default => 1           // « 1 2 3 4 5 »
        };
    }
}
При рендерингу сторінки користувачі побачать оптимізовану кількість посилань на сторінки залежно від загального обсягу даних:
// При 50 статтях (5 сторінок)
« 1 2 3 4 5 »
// При 150 статтях (15 сторінок)
« 1 ... 4 5 6 7 8 ... 15 »
// При 250 статтях (25 сторінок)
« 1 ... 4 5 6 7 8 9 10 ... 25 »
Метод onEachSide дозволяє створювати більш чисті та інтуїтивно зрозумілі інтерфейси пагінації, які адаптуються до ваших даних