このページの2つのバージョン間の差分を表示します。
次のリビジョン | 前のリビジョン 最新のリビジョン 両方とも次のリビジョン | ||
プログラム言語:php:laravel:ページャ [2020/01/14 15:27] humolife 作成 |
プログラム言語:php:laravel:ページャ [2021/01/22 17:05] humolife |
||
---|---|---|---|
行 1: | 行 1: | ||
====== Laravel のページネーション ====== | ====== Laravel のページネーション ====== | ||
+ | 参考:https:// | ||
+ | |||
ユーザ情報を10件ずつ表示するページャを実装したい場合、以下のような記述をすれば可能。 | ユーザ情報を10件ずつ表示するページャを実装したい場合、以下のような記述をすれば可能。 | ||
< | < | ||
$result = DB:: | $result = DB:: | ||
</ | </ | ||
- | ===== ページ番号を指定して表示 ===== | + | ===== ページャの表示 ===== |
- | 10件ずつ表示した場合の、5ページ目を取得した場合は、以下のようにすることで可能になる。 | + | blade の html ファイル内に以下を記述。 |
< | < | ||
- | // 4番目の引数で、ページ数を指定できる | + | {{ $users->links() }} |
- | $result = DB:: | + | |
</ | </ | ||
- | 参考:https: | + | ===== ビューのカスタマイズ ===== |
+ | ページャ呼び出し時に、ビューのファイル名を指定する。 | ||
+ | < | ||
+ | {{ $users-> | ||
+ | </code> | ||
+ | ===== ページャに表示するリンクの調整 ===== | ||
+ | Laravel 7 のマニュアルによれば以下の記載で、両サイドに表示するリンクの数を調整できるらしいが、私の環境では動作せず。 | ||
+ | < | ||
+ | {{ $users-> | ||
+ | </code> | ||
+ | 仕方ないので、ビューファイル内で自分で調整を。\\ | ||
+ | html ファイルの呼び出し時に、side パラメータで両サイドに表示するリンク数を渡す。 | ||
+ | < | ||
+ | {{ $arts-> | ||
+ | </code> | ||
+ | layouts/ | ||
+ | < | ||
+ | @if ($paginator-> | ||
+ | < | ||
+ | @if (!$paginator-> | ||
+ | <li class=" | ||
+ | @endif | ||
+ | @if ($paginator-> | ||
+ | <li class=" | ||
+ | @endif | ||
+ | |||
+ | @foreach ($elements as $element) | ||
+ | @if (is_array($element)) | ||
+ | @foreach ($element as $page => $url) | ||
+ | @if ($page == $paginator-> | ||
+ | <li class=" | ||
+ | @else | ||
+ | <?php | ||
+ | if ($page + $side < $paginator-> | ||
+ | && !($page === 1 && $paginator-> | ||
+ | ) { | ||
+ | continue; | ||
+ | } elseif ($page - $side > $paginator-> | ||
+ | && !( | ||
+ | $page === $paginator-> | ||
+ | && $paginator-> | ||
+ | ) | ||
+ | ) { | ||
+ | continue; | ||
+ | } | ||
+ | ?> | ||
+ | < | ||
+ | @endif | ||
+ | @endforeach | ||
+ | @endif | ||
+ | @endforeach | ||
+ | |||
+ | @if ($paginator-> | ||
+ | <li class=" | ||
+ | @endif | ||
+ | @if ($paginator-> | ||
+ | <li class=" | ||
+ | @endif | ||
+ | </ | ||
+ | @endif | ||
+ | </ | ||
+ | これで現在のページの左右に side で指定した数だけリンクが表示されることを確認できました。 |