web-dev-qa-db-ja.com

Laravelページネーションで表示されるリンクの量を制限する

Laravelsページネーションで表示されるリンクの数を制限する簡単な方法はありますか？

現在、最大13個のリンクが表示されています（前へ、1 2 3 4 5 7 8 .. 78 79次へ）

ただし、これはモバイルデバイスには多すぎるため、2行のナビゲーションになります...にリンクを設定する方法はありますか。 10だけを表示しますか？

私はページネーションのプレゼンターをいじりましたが、実際には何も機能していないようです。

ありがとう

phplaravelpagination
21
Lovelock

カスタムプレゼンターを定義する古い方法は、Laravel 5.3+）では機能しません。表示されるリンクの数は、Illuminate/Pagination/UrlWindow::make()の$onEachSideパラメーターにハードコーディングされているようです：

public static function make(PaginatorContract $paginator, $onEachSide = 3)

私は自分のrender（）関数を書いて、LengthAwarePaginatorからいくつかのコードを盗みました

/**
 * Stole come code from LengthAwarePaginator::render() and ::elements() to allow for a smaller UrlWindow
 *
 * @param LengthAwarePaginator $paginator
 * @param int $onEachSide
 * @return string
 */
public static function render(LengthAwarePaginator $paginator, $onEachSide = 2)
{
    $window = UrlWindow::make($paginator, $onEachSide);

    $elements = array_filter([
        $window['first'],
        is_array($window['slider']) ? '...' : null,
        $window['slider'],
        is_array($window['last']) ? '...' : null,
        $window['last'],
    ]);

    return LengthAwarePaginator::viewFactory()->make(LengthAwarePaginator::$defaultView, [
        'paginator' => $paginator,
        'elements' => $elements,
    ])->render();
}

}

Twigを使用しているので、これをTwigフィルターとして登録しました。Bladeでも同様のことができると思います。

2
barryp

Laravel= 5.7には、ページネーションの両側にあるリンクの数をカスタマイズするための新しいページネーションメソッドがあります。新しいメソッドのおかげで、場合によってはカスタムページネーションビューが不要になりました。APIは次のとおりです。現在のページの各サイドのリンク数を定義するために使用できます。

User::paginate(10)->onEachSide(2);

そのコードをコントローラーに書きます。

詳細は https://laravel-news.com/laravel-5-7-pagination-link-customizations で確認できます

6
Abid Khairy

10個のリンクのみを表示する新しいカスタムプレゼンターを作成しました。これには3つのステップが含まれます。

独自のカスタムプレゼンターを作成する

use Illuminate\Pagination\BootstrapPresenter;

class CustomPresenter extends BootstrapPresenter{
    protected function getPageSlider()
    {
        // Changing the original value from 6 to 3 to reduce the link count
        $window = 3;

        // If the current page is very close to the beginning of the page range, we will
        // just render the beginning of the page range, followed by the last 2 of the
        // links in this list, since we will not have room to create a full slider.
        if ($this->currentPage <= $window)
        {
            $ending = $this->getFinish();

            return $this->getPageRange(1, $window + 2).$ending;
        }

        // If the current page is close to the ending of the page range we will just get
        // this first couple pages, followed by a larger window of these ending pages
        // since we're too close to the end of the list to create a full on slider.
        elseif ($this->currentPage >= $this->lastPage - $window)
        {
            $start = $this->lastPage - 8;

            $content = $this->getPageRange($start, $this->lastPage);

            return $this->getStart().$content;
        }

        // If we have enough room on both sides of the current page to build a slider we
        // will surround it with both the beginning and ending caps, with this window
        // of pages in the middle providing a Google style sliding paginator setup.
        else
        {
            $content = $this->getAdjacentRange();

            return $this->getStart().$content.$this->getFinish();
        }
    }

}

独自のページネーションビュー（custom-paginator.phpなど）を作成し、viewsフォルダに配置します

<ul class="pagination">
    <?php echo with(new CustomPresenter($paginator))->render(); ?>
</ul>

あなたの更新app/config.view.php

'pagination' => 'custom-paginator',

以下の変更を行うことにより、10リンクのページ編集機能を取得できます。

この助けを願っています：D

5
Zesky

私はcssを使用して、許可したリンクを制限しました。本当に簡単です。これを拡張して、任意の数のブレークポイントで任意の数のページを表示できます。

@media screen and ( max-width: 400px ){

    li.page-item {

        display: none;
    }

    .page-item:first-child,
    .page-item:nth-child( 2 ),
    .page-item:nth-last-child( 2 ),
    .page-item:last-child,
    .page-item.active,
    .page-item.disabled {

        display: block;
    }
}

この特定の実装では、矢印、「...」、最初のページ、アクティブなページ、最後のページが許可されます

4
Erik White

Laravel 5.6+

ベンダーテンプレートの公開：

php artisan vendor:publish --tag=laravel-pagination

編集bootstrap-4.blade.php 次のように：

@if ($paginator->hasPages())
<ul class="pagination" role="navigation">
    {{-- Previous Page Link --}}
    @if ($paginator->onFirstPage())
        <li class="page-item disabled" aria-disabled="true" aria-label="@lang('pagination.previous')">
            <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

    <?php
        $start = $paginator->currentPage() - 2; // show 3 pagination links before current
        $end = $paginator->currentPage() + 2; // show 3 pagination links after current
        if($start < 1) {
            $start = 1; // reset start to 1
            $end += 1;
        } 
        if($end >= $paginator->lastPage() ) $end = $paginator->lastPage(); // reset end to last page
    ?>

    @if($start > 1)
        <li class="page-item">
            <a class="page-link" href="{{ $paginator->url(1) }}">{{1}}</a>
        </li>
        @if($paginator->currentPage() != 4)
            {{-- "Three Dots" Separator --}}
            <li class="page-item disabled" aria-disabled="true"><span class="page-link">...</span></li>
        @endif
    @endif
        @for ($i = $start; $i <= $end; $i++)
            <li class="page-item {{ ($paginator->currentPage() == $i) ? ' active' : '' }}">
                <a class="page-link" href="{{ $paginator->url($i) }}">{{$i}}</a>
            </li>
        @endfor
    @if($end < $paginator->lastPage())
        @if($paginator->currentPage() + 3 != $paginator->lastPage())
            {{-- "Three Dots" Separator --}}
            <li class="page-item disabled" aria-disabled="true"><span class="page-link">...</span></li>
        @endif
        <li class="page-item">
            <a class="page-link" href="{{ $paginator->url($paginator->lastPage()) }}">{{$paginator->lastPage()}}</a>
        </li>
    @endif

    {{-- 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('pagination.next')">
            <span class="page-link" aria-hidden="true">&rsaquo;</span>
        </li>
    @endif
</ul>
@endif

この例は、新しいCSSクラス、アクティブリンク、3つのドット（正しくは1..2 3 4ではない）を正しく処理し、カスタマイズ可能（表示するページ数）です。

例

つのドットが正しく処理されました

3
Jacopo Bernasconi

私はそれが古い質問であることを知っていますが、関数のlink（）パラメータを使用して設定する方法はまだありません。私は単純なjQueryコードを作成しました。多分それは誰かを助けるでしょう。 Zeskyの回答よりもはるかに単純です。私はより良いという意味ではなく、単純にしています:)

JavaScript：

(function($) {
    $('ul.pagination li.active')
        .prev().addClass('show-mobile')
        .prev().addClass('show-mobile');
    $('ul.pagination li.active')
        .next().addClass('show-mobile')
        .next().addClass('show-mobile');
    $('ul.pagination')
        .find('li:first-child, li:last-child, li.active')
        .addClass('show-mobile');
})(jQuery);

CSS：

@media (max-width: /* write what you need, for me it's 560px */) {
    ul.pagination li:not(.show-mobile) {
        display: none;
    }
}

このコードは、いくつかのli要素のみを表示します。アクティブ、2つ前、2つ後、前/次の矢印。これにより、15ではなく最大で7つの要素しか表示されなくなります。

2
ElChupacabra

以下のコードを使用して、ビューフォルダー内の新しいページネーションフォルダーにdefault.blade.phpファイルを1つ作成します。つまり、コアページネーションファイルを新しいページネーションファイルで上書きしていることになります。それはページネーションリンクにいくつかの制限を設定します。

@if ($paginator->hasPages())
    <ul class="pagination pagination">
        {{-- Previous Page Link --}}
        @if ($paginator->onFirstPage())
            <li class="disabled"><span>«</span></li>
        @else
            <li><a href="{{ $paginator->previousPageUrl() }}" rel="prev">«</a></li>
        @endif

        @if($paginator->currentPage() > 3)
            <li class="hidden-xs"><a href="{{ $paginator->url(1) }}">1</a></li>
        @endif
        @if($paginator->currentPage() > 4)
            <li><span>...</span></li>
        @endif
        @foreach(range(1, $paginator->lastPage()) as $i)
            @if($i >= $paginator->currentPage() - 2 && $i <= $paginator->currentPage() + 2)
                @if ($i == $paginator->currentPage())
                    <li class="active"><span>{{ $i }}</span></li>
                @else
                    <li><a href="{{ $paginator->url($i) }}">{{ $i }}</a></li>
                @endif
            @endif
        @endforeach
        @if($paginator->currentPage() < $paginator->lastPage() - 3)
            <li><span>...</span></li>
        @endif
        @if($paginator->currentPage() < $paginator->lastPage() - 2)
            <li class="hidden-xs"><a href="{{ $paginator->url($paginator->lastPage()) }}">{{ $paginator->lastPage() }}</a></li>
        @endif

        {{-- Next Page Link --}}
        @if ($paginator->hasMorePages())
            <li><a href="{{ $paginator->nextPageUrl() }}" rel="next">»</a></li>
        @else
            <li class="disabled"><span>»</span></li>
        @endif
    </ul>
@endif

次に、ページネーションを取得する場所で、このビューファイルパラメータを使用してlaravelページネーション関数を呼び出す必要があります。

 $data->links('pagination.default')
2
Bhavin Thummar

正確にどのように動作させたいかに応じて、さまざまな方法で対処できます。

私のニーズのために、モバイルレイアウトを壊さないように短くするための簡単な解決策が必要でした。

Laravel 5.3

このファイルを編集します（または、ページネーター呼び出しで使用しているファイル）。

/vendor/pagination/bootstrap-4.blade.php

1つの行を追加して、2つのリンクの後にリンクレンダリングループから抜け出します。

{{-- Array Of Links --}}
    @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>
                  {{--Add the line below to limit rendered links--}}
                  <?php if($loop->count > 2) break; ?>
              @endif
         @endforeach
     @endif
2
JR Lawhorne

テーブルが狭すぎたので、jQuery filter（）によるページ分割の最初と最後のli（次へと戻るの矢印）だけを表示することにしました。これはさらにカスタマイズできます。

$('ul.pagination li').hide().filter(':lt(1), :nth-last-child(1)').show();

Bodyタグの最後の前に追加してください。

1
Waqas Bukhary

これは古い質問ですが、Laravel 5.2アプリケーションでページネーションリンクの数を減らす方法を最近達成した方法を共有したいと思いました。

ViewServiceProviderの中：

 \Illuminate\Pagination\AbstractPaginator::presenter(function($paginator) {
      return new \App\Pagination\BootstrapPresenter($paginator);
 });

App\Pagination\BootstrapPresenter.php

<?php namespace App\Pagination;

use Illuminate\Pagination\UrlWindow;
use Illuminate\Contracts\Pagination\Paginator as PaginatorContract;
use Illuminate\Pagination\BootstrapThreePresenter as LaravelBootstrapThreePresenter;

class BootstrapPresenter extends LaravelBootstrapThreePresenter
{
    /**
     * Create a new Bootstrap presenter instance.
     *
     * @param  \Illuminate\Contracts\Pagination\Paginator  $paginator
     * @param  \Illuminate\Pagination\UrlWindow|null  $window
     * @return void
     */
    public function __construct(PaginatorContract $paginator, UrlWindow $window = null)
    {
        $this->paginator = $paginator;

        // Make the pagination window smaller (default is 3).
        $this->window = UrlWindow::make($paginator, 1);
    }
}

から：

enter image description here

に：

enter image description here

1
Gary Green

これは古い質問ですが、ここでの回答はいずれも最新のLaravelドキュメンテーションではありません。Laravel（Laravel $ 5.6 +）の新しいバージョンの場合、この問題には多少簡単な修正がありますが、 Laravel Documentation のように、ベンダーのページネーションビューを公開する必要があります。デフォルトのページネーションビューをまだ公開または変更していない場合、コマンド実行は：

php artisan vendor:publish --tag=laravel-pagination

ビューが公開されると、resources/views/vendor/paginationディレクトリにbootstrap-4.blade.phpが見つかります。このファイルを編集して、ページ付けリンクを好きなように表示させることができます。デフォルトで表示されるリンクの数を減らすために、以下に示すように、インラインphpを少し使用してインデックスを設定し、表示するリンクの数を制限しました。

{{-- Array Of Links --}}
@if (is_array($element))
    <?php $index = 0; ?>
    @foreach ($element as $page => $url)
        @if($index<4)
            @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
        @endif
        <?php $index++ ?>
    @endforeach
@endif

このコードのほとんどは、bootstrap-4.blade.phpのデフォルトのブレードビューにありますが、ページネーションの左側にあるリンクの数を制限するために$ index = 0、$ index <4、$ index ++コードを追加しました4。

これは、Laravelドキュメントに従って、composerベンダーファイルを編集せずに、または他の方法でシステムをハッキングしようとせずに、この問題を処理する正しい方法です。 JR Lawhorneが同様の回答を投稿したことを理解していますが、投稿する前にベンダーファイルを公開するプロセス全体が含まれていません。

1
eResourcesInc