Yii2 LinkPager分页参数说明, 输入跳转到某页实例

跳转到某页
功能基于linkpager扩展，具体实现为重构系统yiiwidgetsLinkPager类,使用起来跟原来一样,只多一个go的参数,
效果图如下

在common\components目录新建GoLinkPager类文件,代码如下,方法代码来源于yii\widgets\LinkPager, 注意go跳转部分代码

<?php
// 分页widget 带跳转
namespace common\components;
use yii\widgets\LinkPager;
use yii\helpers\Html;

class GoLinkPager extends LinkPager {

    public $go = false; // 是否开启跳转功能 默认false

    //重写父类方法 增加跳转
    protected function renderPageButtons() {
        $pageCount = $this->pagination->getPageCount();
        if ($pageCount < 2 && $this->hideOnSinglePage) {
            return '';
        }

        $buttons = [];
        $currentPage = $this->pagination->getPage();

        // first page
        $firstPageLabel = $this->firstPageLabel === true ? '1' : $this->firstPageLabel;
        if ($firstPageLabel !== false) {
            $buttons[] = $this->renderPageButton($firstPageLabel, 0, $this->firstPageCssClass, $currentPage <= 0, false);
        }

        // prev page
        if ($this->prevPageLabel !== false) {
            if (($page = $currentPage - 1) < 0) {
                $page = 0;
            }
            $buttons[] = $this->renderPageButton($this->prevPageLabel, $page, $this->prevPageCssClass, $currentPage <= 0, false);
        }

        // internal pages
        list($beginPage, $endPage) = $this->getPageRange();
        for ($i = $beginPage; $i <= $endPage; ++$i) {
            $buttons[] = $this->renderPageButton($i + 1, $i, null, false, $i == $currentPage);
        }

        // next page
        if ($this->nextPageLabel !== false) {
            if (($page = $currentPage + 1) >= $pageCount - 1) {
                $page = $pageCount - 1;
            }
            $buttons[] = $this->renderPageButton($this->nextPageLabel, $page, $this->nextPageCssClass, $currentPage >= $pageCount - 1, false);
        }

        // last page
        $lastPageLabel = $this->lastPageLabel === true ? $pageCount : $this->lastPageLabel;
        if ($lastPageLabel !== false) {
            $buttons[] = $this->renderPageButton($lastPageLabel, $pageCount - 1, $this->lastPageCssClass, $currentPage >= $pageCount - 1, false);
        }

        // go跳转
        if($this->go) {
            $goPage = ($currentPage+2)>=$pageCount?$pageCount:($currentPage + 2);
            $goHtml = <<<goHtml
            <div class="golink">
                <div class="gopa">
                    <span>共 {$pageCount} 页</span>
                    <span>到第</span>
                    <input class="goinput" type="number" value="{$goPage}" min="1" max="{$pageCount}">
                    <span class="text">页</span>
                </div>
                <div class="gobutton">确定</div>
            </div>
goHtml;
            $buttons[] = $goHtml;
            $pageLink = $this->pagination->createUrl(false);
            $goJs = <<<goJs
            $(".gobutton").on("click", function () {
                _pageInput = $(".goinput"),
                goPage = _pageInput.val(),
                pageLink = "{$pageLink}";
                if(goPage < 1) goPage=1;
                if(goPage >= {$pageCount}) goPage={$pageCount};
                pageLink = pageLink.replace("page=1", "page="+goPage);
                //if (goPage >= 1 && goPage <= {$pageCount}) {
                    window.location.href=pageLink;
                //} else {
                    //_pageInput.focus();
                //}
            });
goJs;
            $this->view->registerJs($goJs);
        }
        return Html::tag('ul', implode("n", $buttons), $this->options);
    }
}

视图层使用, 如果不启用只需要将参数go=0即可

<?= GoLinkPager::widget([
        'go' => 1,
        'pagination' => $pages,
        'nextPageLabel' => '〉',
        'prevPageLabel' => '〈',
        'firstPageLabel' => '《',
        'lastPageLabel' => '》',
        'maxButtonCount' =>6,
]); ?>

附上css代码, 样式可修改

.golink{font-size:14px;color:#3d445e;float:left;margin-top:0px;height:35px;line-height:35px;}
.golink .gopa{float:left;}
.golink .gopa .goinput{border: 1px solid #e5e5e5;background-color: #ffffff;
    text-align: center;height:35px;line-height:35px;width:46px;}
.golink .gobutton{float:left;background-color: #f0f0f0;border: 1px solid #e5e5e5;cursor:pointer;
    height: 35px;line-height: 35px;text-align: center;width:46px;text-decoration: none;margin-left:10px;}

LinkPager参数说明:

'prevPageLabel' => '〈',            上一页文字
'nextPageLabel' => '〉',           下一页文字
'lastPageLabel' => '》',            尾页文字
'firstPageLabel' => '《',               首页文字
'go' => 1,                                   是否显示跳转,当使用自定义类goLinkPager时有效
'maxButtonCount' => 5           分页显示的页码数量
'hideOnSinglePage' => false,   当分页不足两页时不显示分页
'options' => ['class' => 'm-pagination'],    分页样式自定义