ThinkPHP5 自定义分页模板实现
ThinkPHP5 自定义分页模板实现
在 ThinkPHP5 中,你可以完全自定义分页模板,不使用默认的 Bootstrap 样式。以下是实现方法:
1. 控制器中使用分页
首先在控制器中获取分页数据:
public function index(){ // 获取分页数据 $list = Db::name('user')->paginate(10); // 传递数据到视图 $this->assign('list', $list); return $this->fetch();}
2. 创建自定义分页模板
在 view
目录下创建 page.html
文件(或者你喜欢的任何名称),例如:
<div class="my-pagination"> {if $list->currentPage() > 1} <a href="{$list->url($list->currentPage()-1)}" class="prev">上一页</a> {else} <span class="disabled prev">上一页</span> {/if} {volist name="list->render()" id="page"} {if $page.current} <span class="current">{$page.num}</span> {else} <a href="{$page.url}">{$page.num}</a> {/if} {/volist} {if $list->currentPage() < $list->lastPage()} <a href="{$list->url($list->currentPage()+1)}" class="next">下一页</a> {else} <span class="disabled next">下一页</span> {/if}</div>
3. 在视图中使用自定义分页模板
在你的列表视图文件中:
<!-- 显示数据列表 -->{volist name="list" id="vo"} {$vo.name} {/volist}<!-- 显示分页 -->{$list->render('page')} <!-- 这里的'page'对应你创建的分页模板文件名 -->
4. 完全自定义样式
你可以通过 CSS 为你的分页添加任意样式:
.my-pagination { margin: 20px 0; text-align: center;}.my-pagination a, .my-pagination span { display: inline-block; padding: 5px 10px; margin: 0 5px; border: 1px solid #ddd; text-decoration: none; color: #333;}.my-pagination a:hover { background: #f5f5f5;}.my-pagination .current { background: #428bca; color: white; border-color: #428bca;}.my-pagination .disabled { color: #999; cursor: not-allowed;}
5. 高级自定义选项
如果你需要更复杂的自定义,可以修改分页类的配置:
// 在控制器中$list = Db::name('user')->paginate(10, false, [ 'type' => 'Bootstrap', 'var_page' => 'page', 'path' => url('index'), // 自定义分页URL 'query' => [], // 附加URL参数 'fragment' => '', // URL锚点]);
6. 完全自定义分页类
如果需要更高级的控制,可以创建自己的分页驱动:
创建自定义分页驱动类
app\common\paginator\MyPaginator.php
继承
think\paginator\driver\Bootstrap
重写
render()
方法在配置文件中设置默认分页驱动:
// config.php 'paginate' => [ 'type' => 'app\common\paginator\MyPaginator', 'var_page' => 'page']
这样你就可以完全控制分页的HTML输出了。
补充:在 application/common/paginator
目录下创建 MyPaginator.php
文件:
<?php namespace app\common\paginator; use think\Paginator; class MyPaginator extends Paginator { /** * 渲染分页html * @return string */ public function render() { if ($this->hasPages()) { return sprintf( '<div class="my-pagination">%s %s %s</div>', $this->getPreviousButton(), $this->getLinks(), $this->getNextButton() ); } return ''; } /** * 生成上一页按钮 * @param string $text * @return string */ protected function getPreviousButton($text = "上一页") { if ($this->currentPage() <= 1) { return $this->getDisabledTextWrapper($text); } $url = $this->url( $this->currentPage() - 1 ); return $this->getPageLinkWrapper($url, $text, 'prev'); } /** * 生成下一页按钮 * @param string $text * @return string */ protected function getNextButton($text = '下一页') { if (!$this->hasMore) { return $this->getDisabledTextWrapper($text); } $url = $this->url( $this->currentPage() + 1 ); return $this->getPageLinkWrapper($url, $text, 'next'); } /** * 生成页码按钮 * @return string */ protected function getLinks() { $html = ''; // 计算页码范围 $start = max(1, $this->currentPage() - 3); $end = min($this->lastPage, $this->currentPage() + 3); for ($page = $start; $page <= $end; $page++) { if ($page == $this->currentPage()) { $html .= $this->getActivePageWrapper($page); } else { $html .= $this->getAvailablePageWrapper($page); } } return $html; } /** * 生成一个可点击的按钮 * @param string $url * @param string $page * @param string $class * @return string */ protected function getPageLinkWrapper($url, $page, $class = '') { $class = $class ? ' class="' . $class . '"' : ''; return '<a href="' . htmlentities($url) . '"' . $class . '>' . $page . '</a>'; } /** * 生成一个禁用的按钮 * @param string $text * @return string */ protected function getDisabledTextWrapper($text) { return '<span class="disabled">' . $text . '</span>'; } /** * 生成一个激活的按钮 * @param string $text * @return string */ protected function getActivePageWrapper($text) { return '<span class="current">' . $text . '</span>'; } /** * 生成一个普通页码按钮 * @param string $page * @return string */ protected function getAvailablePageWrapper($page) { return $this->getPageLinkWrapper($this->url($page), $page); } }