So implementieren Sie eine Paging-Funktion im benutzerdefinierten Stil in Laravel

Mit der kontinuierlichen Weiterentwicklung des Laravel-Frameworks entscheiden sich mittlerweile immer mehr Webprojekte dafür. Natürlich entscheiden sich auch viele Entwickler dafür, Laravel für die Entwicklung ihrer eigenen Websites zu verwenden. In der täglichen Entwicklung besteht die übliche Vorgehensweise darin, zunächst nach Open-Source-Bibliotheken zu suchen oder selbst Komponenten zu schreiben. In diesem Artikel erfahren Sie, wie das geht Verwenden Sie es. Laravel verfügt über eine eigene Paging-Klasse, um benutzerdefiniertes Paging zu implementieren.

Laravels eigene Paging-Klasse

Das Laravel-Framework verfügt über eine Paging-Bibliothek, die sehr bequem zu verwenden ist. Im Controller verwenden wir im Allgemeinen die Methode paginate(), um Daten abzufragen und Paginierungsergebnisse zurückzugeben, während wir in der Blade-Vorlage direkt die Methode links() zum Rendern verwenden können Paginierungslinks. Schauen Sie sich den folgenden Code an: paginate() 方法来查询数据并返回分页结果，而在 Blade 模板中我们可以直接使用 links() 方法来渲染分页链接，看下面的代码：

// 在控制器中查询数据并返回分页结果
$data = DB::table('table_name')->paginate(15);

// 在 Blade 模板中通过 links() 方法渲染分页链接
{{ $data->links() }}

这样代码就完成了分页查询的工作，并且将分页链接渲染到了页面上。但是这样的链接样式是默认的，如果想要更改样式，我们需要自定义视图。

自定义视图

我们先来了解下 links() 方法，我们可以在 Blade 模板中输出一下 {{ $data->links() }} 的值，得到的结果是这样的：

<ul class="pagination">
    <li class="page-item disabled" aria-disabled="true" aria-label="&laquo; Previous">
        <span class="page-link" aria-hidden="true">&lsaquo;</span>
    </li>
    <li class="page-item active" aria-current="page"><span class="page-link">1</span></li>
    <li class="page-item"><a class="page-link" href="http://localhost?page=2">2</a></li>
    <li class="page-item"><a class="page-link" href="http://localhost?page=3">3</a></li>
    <li class="page-item"><a class="page-link" href="http://localhost?page=4">4</a></li>
    <li class="page-item"><a class="page-link" href="http://localhost?page=5">5</a></li>
    <li class="page-item">
        <a class="page-link" href="http://localhost?page=2" rel="next" aria-label="Next &raquo;">&rsaquo;</a>
    </li>
</ul>

我们发现，links() 方法默认渲染的分页链接是一个无序列表，每一项都是一个独立的 li 元素，其中 active 类表示当前页码，disabled 类表示不可用的页码。如果我们想要自定义分页链接的样式，就需要在视图文件中覆盖 Laravel 默认的链接渲染。

在 Laravel 中，可以使用 php artisan make:view 命令来生成视图文件，如下：

php artisan make:view pagination

这个命令将在 resources/views 目录下创建一个名为 pagination.blade.php 的文件。在该文件中写入如下代码：

@if ($paginator->hasPages())
    <nav>
        <ul class="pagination">
            {{-- Previous Page Link --}}
            @if ($paginator->onFirstPage())
                <li class="page-item disabled" aria-disabled="true" aria-label="@lang(&#39;pagination.previous&#39;)">
                    <span class="page-link" aria-hidden="true">&lsaquo;</span>
                </li>
            @else
                <li class="page-item">
                    <a class="page-link" href="{{ $paginator->previousPageUrl() }}" rel="prev" aria-label="@lang('pagination.previous')">&lsaquo;</a>
                </li>
            @endif

            {{-- Pagination Elements --}}
            @foreach ($elements as $element)
                {{-- "Three Dots" Separator --}}
                @if (is_string($element))
                    <li class="page-item disabled" aria-disabled="true"><span class="page-link">{{ $element }}</span></li>
                @endif

                {{-- Array Of Links --}}
                @if (is_array($element))
                    @foreach ($element as $page => $url)
                        @if ($page == $paginator->currentPage())
                            <li class="page-item active" aria-current="page"><span class="page-link">{{ $page }}</span></li>
                        @else
                            <li class="page-item"><a class="page-link" href="{{ $url }}">{{ $page }}</a></li>
                        @endif
                    @endforeach
                @endif
            @endforeach

            {{-- Next Page Link --}}
            @if ($paginator->hasMorePages())
                <li class="page-item">
                    <a class="page-link" href="{{ $paginator->nextPageUrl() }}" rel="next" aria-label="@lang('pagination.next')">&rsaquo;</a>
                </li>
            @else
                <li class="page-item disabled" aria-disabled="true" aria-label="@lang(&#39;pagination.next&#39;)">
                    <span class="page-link" aria-hidden="true">&rsaquo;</span>
                </li>
            @endif
        </ul>
    </nav>
@endif

这段代码是 Laravel 默认的分页视图代码，我们可以将其拷贝到 pagination.blade.php

<nav aria-label="Page navigation example">
  <ul class="pagination justify-content-center">
    @if ($paginator->onFirstPage())
        <li class="page-item disabled"><span class="page-link">上一页</span></li>
    @else
        <li class="page-item"><a class="page-link" href="{{ $paginator->previousPageUrl() }}">上一页</a></li>
    @endif

    @foreach ($elements as $element)
        @if (is_string($element))
            <li class="page-item disabled"><span class="page-link">{{ $element }}</span></li>
        @endif

        @if (is_array($element))
            @foreach ($element as $page => $url)
                @if ($page == $paginator->currentPage())
                    <li class="page-item active"><span class="page-link">{{ $page }}</span></li>
                @else
                    <li class="page-item"><a class="page-link" href="{{ $url }}">{{ $page }}</a></li>
                @endif
            @endforeach
        @endif
    @endforeach

    @if ($paginator->hasMorePages())
        <li class="page-item"><a class="page-link" href="{{ $paginator->nextPageUrl() }}">下一页</a></li>
    @else
        <li class="page-item disabled"><span class="page-link">下一页</span></li>
    @endif
  </ul>
</nav>

Auf diese Weise vervollständigt der Code die Arbeit der Paginierungsabfrage und rendert den Paginierungslink zur Seite. Dieser Linkstil ist jedoch der Standard. Wenn wir den Stil ändern möchten, müssen wir die Ansicht anpassen.

Benutzerdefinierte Ansicht

Lassen Sie uns zunächst die Methode links() verstehen. Wir können sie in der Blade-Vorlage {{ $data->links() }} ausgeben , das Ergebnis ist wie folgt:

rrreee

Wir haben festgestellt, dass der von der Methode links() standardmäßig gerenderte Paging-Link eine ungeordnete Liste ist und jedes Element ein unabhängiger liist >-Element, wobei die Klasse active die aktuelle Seitenzahl und die Klasse disabled eine nicht verfügbare Seitenzahl darstellt. Wenn wir den Stil von Paginierungslinks anpassen möchten, müssen wir Laravels Standard-Link-Rendering in der Ansichtsdatei überschreiben.

In Laravel können Sie den Befehl php artisan make:view verwenden, um eine Ansichtsdatei wie folgt zu generieren:

rrreee

Dieser Befehl erstellt einen Namen im Verzeichnis resources/views code>-Verzeichnis Die Datei ist <code>pagination.blade.php. Schreiben Sie den folgenden Code in diese Datei:

rrreee

Dieser Code ist Laravels Standard-Paginierungsansichtscode. Wir können ihn in die Datei pagination.blade.php kopieren und dann anpassen. 🎜🎜Benutzerdefinierter Stil🎜🎜Der benutzerdefinierte Stil hängt von den eigenen Vorlieben des Entwicklers ab. Beispielsweise können wir den Paging-Link in einen Schaltflächenstil ändern: 🎜rrreee🎜Da es normalerweise nicht zu viele Paging-Links und die Paging-Link-Stile verschiedener Seiten gibt Es kann anders sein, daher bieten wir hier nur eine einfache Änderungsmethode an, die Entwickler flexibel an ihre eigenen Bedürfnisse anpassen können. 🎜🎜Zusammenfassung🎜🎜Durch die Einleitung dieses Artikels haben wir erfahren, wie die mit dem Laravel-Framework gelieferte Paging-Klasse implementiert wird und wie der Stil von Paging-Links durch benutzerdefinierte Ansichten geändert wird. Natürlich ist diese Anpassung nicht auf Paginierungsstile beschränkt, Entwickler können sie auch auf verschiedene andere Layoutstile anwenden. 🎜🎜In der tatsächlichen Entwicklung können exzellente Entwickler jederzeit das Potenzial des Frameworks entdecken und es entsprechend ihren eigenen Bedürfnissen optimieren. Dies ist eine der Technologien, die beherrscht werden müssen, um ein exzellenter Entwickler zu werden. Ich hoffe, dass dieser Artikel für alle hilfreich sein kann, und ich hoffe auch, dass jeder ein tieferes Verständnis und eine bessere Anwendung des Laravel-Frameworks erlangen kann. 🎜

Das obige ist der detaillierte Inhalt vonSo implementieren Sie eine Paging-Funktion im benutzerdefinierten Stil in Laravel. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!