Yii2分頁(yè)的使用及其擴(kuò)展方法詳解
前言：
說(shuō)明下我們本篇文章都要講哪些內(nèi)容
分頁(yè)的使用，一步一步的教你怎么做
分頁(yè)類LinkPager和Pagination都可以自定義哪些屬性
分頁(yè)類LinkPager如何擴(kuò)展成我們所需要的
第一步，我們來(lái)看看yii2自帶的分頁(yè)類該如何去使用？
1、controller action
use yii\data\Pagination;
$query = Article::find()->where(['status' => 1]);
$countQuery = clone $query;
$pages = new Pagination(['totalCount' => $countQuery->count()]);
$models = $query->offset($pages->offset)
->limit($pages->limit)
->all();
return $this->render('index', [
'models' => $models,
'pages' => $pages,
]);
2、View
use yii\widgets\LinkPager;
//循環(huán)展示數(shù)據(jù)
foreach ($models as $model) {
// ......
}
//顯示分頁(yè)頁(yè)碼
echo LinkPager::widget([
'pagination' => $pages,
])
代碼基本上可以完全拷貝，修改部分?jǐn)?shù)據(jù)即可，相信大多數(shù)人都是看得懂的。
我們接下來(lái)看第二步，自帶的分頁(yè)類都可以定義哪些屬性
首先我們說(shuō)說(shuō)LinkPager組件
.pagination參數(shù)必填，這個(gè)是我們Pagination類的實(shí)例
默認(rèn)分頁(yè)類是下面這個(gè)樣子的
.上下頁(yè)按鈕以及10個(gè)按鈕
首先，我們把上下頁(yè)的按鈕修改成中文
<?= LinkPager::widget([ 'pagination' => $pages, 'nextPageLabel' => '下一頁(yè)', 'prevPageLabel' => '上一頁(yè)', ]); ?>
如果你不想要顯示上下頁(yè)，可以將prevPageLabel和nextPageLabel設(shè)置為false
<?= LinkPager::widget([ 'pagination' => $pages, 'nextPageLabel' => false, 'prevPageLabel' => false, ]); ?>
默認(rèn)不顯示首頁(yè)也尾頁(yè)，如果你需要，可以這樣設(shè)置
<?= LinkPager::widget([ 'pagination' => $pages, 'firstPageLabel' => '首頁(yè)', 'lastPageLabel' => '尾頁(yè)', ]); ?>
如果你的數(shù)據(jù)過(guò)少，不夠2頁(yè)，默認(rèn)不顯示分頁(yè)，如果你需要，設(shè)置hideOnSinglePage=false即可
<?= LinkPager::widget([ 'pagination' => $pages, 'hideOnSinglePage' => false, ]); ?>
默認(rèn)顯示的頁(yè)碼為10頁(yè)，可以設(shè)置maxButtonCount為你想要展示的頁(yè)數(shù)
<?= LinkPager::widget([ 'pagination' => $pages, 'maxButtonCount' => 5, ]); ?>
有些人不喜歡默認(rèn)的樣式，想要分頁(yè)帶上自己的樣式，可以設(shè)置options，不要忘了自行實(shí)現(xiàn)pre,next,disabled等樣式
<?= LinkPager::widget([ 'pagination' => $pages, 'options' => ['class' => 'm-pagination'], ]); ?>
接下來(lái)我們談?wù)凱agination組件
默認(rèn)的分頁(yè)路由是下面這樣子的，我們看看能做點(diǎn)什么
/controller/action?page=2&per-page=20
首先，我們是必須要指定總條數(shù)totalCount的，沒(méi)這個(gè)參數(shù)，分頁(yè)也是沒(méi)辦法實(shí)現(xiàn)的
$pages = new Pagination([ 'totalCount' => $totalCount, ]);
默認(rèn)分頁(yè)的數(shù)量是20，你可以設(shè)置pageSize為你想要的
$pages = new Pagination([ 'totalCount' => $totalCount, 'pageSize' => 5, ]);
從上面的分頁(yè)路由我們可以看到，默認(rèn)帶的有每頁(yè)的數(shù)量per-page 如果你不想顯示該參數(shù)，設(shè)置pageSizeParam=false就好
$pages = new Pagination([ 'totalCount' => $totalCount, 'pageSizeParam' => false, ]);
我們也可以看到，默認(rèn)的頁(yè)面取決于參數(shù)page,如果你想改變?cè)搮?shù)為p,設(shè)置pageParam=p就好
$pages = new Pagination([ 'totalCount' => $totalCount, 'pageParam' => 'p', ]);
如果你的分頁(yè)存在于首頁(yè)，相信你肯定想要/?p=1而不是/site/index?p=1，我們看看怎么隱藏掉路由
$pages = new Pagination([ 'totalCount' => $totalCount, 'route' => false, ]);
可能你會(huì)發(fā)現(xiàn)分頁(yè)類Pagination有一個(gè)bug,假如我們只有1頁(yè)的數(shù)據(jù)，但是手動(dòng)更改地址欄的page=20的時(shí)候，也會(huì)顯示page=1的數(shù)據(jù)？當(dāng)然，這在大部分接口API中就很讓人厭煩。但是，這并非bug,而是一種友好的驗(yàn)證。設(shè)置validatePage=false即可避免掉該問(wèn)題
$pages = new Pagination([ 'totalCount' => $totalCount, 'validatePage' => false, ]);
最后，我們整點(diǎn)新花樣，擴(kuò)展下他這個(gè)自帶的分頁(yè)！別一看見(jiàn)擴(kuò)展倆字下面的就直接不看了，只有自己學(xué)會(huì)擴(kuò)展了，以后才能越來(lái)越強(qiáng)！怎么個(gè)擴(kuò)展法呢？我們把分頁(yè)組件改為上下頁(yè)那種，具體參考下圖做個(gè)對(duì)比吧
接下來(lái)我們就來(lái)看看右側(cè)的效果具體是如何通過(guò)擴(kuò)展LinkPager組件實(shí)現(xiàn)的。源碼分享給大家，喜歡的拿去自己研究即可。
<?php
namespace frontend\components;
use yii\widgets\LinkPager;
use yii\helpers\Html;
class MLinkPager extends LinkPager
{
public $prevPageLabel = '<i class="fa fa-angle-left"></i>';
public $nextPageLabel = '<i class="fa fa-angle-right"></i>';
public $currentCountPageLabel = '第 {currentPage} 頁(yè) / 共 {countPage} 頁(yè)';
public $currentCountPageClass = 'page-number';
public $hideOnSinglePage = false;
public function init () {
parent::init();
}
public function run () {
$pageCount = $this->pagination->getPageCount();
if ($pageCount < 2 && $this->hideOnSinglePage) {
return '';
}
$buttons = [];
$currentPage = $this->pagination->getPage();
// prev page
if ($this->prevPageLabel !== false) {
if (($page = $currentPage - 1) < 0) {
$page = 0;
}
$buttons[] = $this->renderPageButton($this->prevPageLabel, $page, $this->prevPageCssClass, $currentPage <= 0, false);
}
// current page / count page
if ($this->currentCountPageLabel !== false && $pageCount) {
$currentCountPageLabel = str_replace(['{currentPage}', '{countPage}'], [$currentPage+1, $pageCount], $this->currentCountPageLabel);
$buttons[] = Html::tag('span', $currentCountPageLabel, array('class' => $this->currentCountPageClass));
}
// 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);
}
return Html::tag('nav', implode("\n", $buttons), $this->options);
}
protected function renderPageButton($label, $page, $class, $disabled, $active)
{
$options = ['class' => empty($class) ? $this->pageCssClass : $class];
if ($active) {
Html::addCssClass($options, $this->activePageCssClass);
}
if ($disabled) {
return false;
}
$linkOptions = $this->linkOptions;
$linkOptions += $options;
$linkOptions['data-page'] = $page;
return Html::a($label, $this->pagination->createUrl($page), $linkOptions);
}
}
如此一來(lái)，我們調(diào)用MLinkPager實(shí)現(xiàn)分頁(yè)效果像下面這樣即可
use frontend\components\MLinkPager; <?= MLinkPager::widget([ 'pagination' => $pages, ]); ?>
當(dāng)然，自己擴(kuò)展的分頁(yè)組建重在教大家如何去實(shí)現(xiàn)分頁(yè)擴(kuò)展，難免會(huì)有很多問(wèn)題，如果你有好的意見(jiàn)或者方法，直接給我留言，咱們共同溝通交流。
相關(guān)文章
php使用自帶dom擴(kuò)展進(jìn)行元素匹配的原理解析
這篇文章主要介紹了php使用自帶dom擴(kuò)展進(jìn)行元素匹配的原理解析,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2020-05-05
今天小編就為大家分享一篇Laravel 類和接口注入相關(guān)的代碼，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-10-10
這篇文章主要介紹了Yii框架防止sql注入，xss攻擊與csrf攻擊的方法,結(jié)合實(shí)例形式分析了Yii框架針對(duì)sql注入，xss攻擊與csrf攻擊的防范方法與相關(guān)函數(shù)調(diào)用注意事項(xiàng),需要的朋友可以參考下2016-10-10
PHP在彈框中獲取foreach中遍歷的id值并傳遞給地址欄
這篇文章主要介紹了PHP在彈框中獲取foreach中遍歷的id值并傳遞給地址欄的相關(guān)資料,需要的朋友可以參考下2017-06-06
PHP與Ajax相結(jié)合實(shí)現(xiàn)登錄驗(yàn)證小Demo
AJAX即“Asynchronous Javascript And XML”（異步JavaScript和XML），是指一種創(chuàng)建交互式網(wǎng)頁(yè)應(yīng)用的網(wǎng)頁(yè)開(kāi)發(fā)技術(shù)。接下來(lái)通過(guò)本文給大家分享PHP與Ajax相結(jié)合實(shí)現(xiàn)登錄驗(yàn)證小Demo，對(duì)php ajax實(shí)現(xiàn)登錄驗(yàn)證相關(guān)知識(shí)感興趣的朋友一起學(xué)習(xí)吧2016-03-03
隨時(shí)給自己貼的圖片加文字的php代碼...2007-03-03
php微信公眾號(hào)開(kāi)發(fā)（2）百度BAE搭建和數(shù)據(jù)庫(kù)使用
這篇文章主要介紹了php微信公眾號(hào)開(kāi)發(fā)第二課，百度BAE搭建和數(shù)據(jù)庫(kù)使用，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-12-12
這篇文章主要介紹了Smarty環(huán)境配置與使用方法,較為詳細(xì)的分析了Smarty環(huán)境的搭建與配置參數(shù)的功能含義,非常簡(jiǎn)單易懂,需要的朋友可以參考下2016-05-05
PHP使用openssl擴(kuò)展實(shí)現(xiàn)加解密方法示例
這篇文章主要介紹了PHP使用openssl擴(kuò)展實(shí)現(xiàn)加解密方法示例，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-02-02
談到AJAX很多人會(huì)聯(lián)想到JavaScript，直到現(xiàn)在為止各大搜索引擎對(duì)如：javascript、ajax、flash代碼生成的內(nèi)容都沒(méi)辦法很好的抓取。但很多站長(zhǎng)都很喜歡這些效果，可是偏偏各大搜索引擎不能很好的抓取這些代碼所生成的內(nèi)容，使得很多站長(zhǎng)都放棄了這些效果。2014-08-08