资讯专栏INFORMATION COLUMN

Laravel5.1+ 分页Pagination解析以及扩展

LancerComet / 1809人阅读

摘要:文档告诉我们对应于查询语句构造器和的方法,而则等同于方法。那我们还是来看下源码,具体这个是如何实现的中传入的是一个的实例,并调用这个实例化的方法来实现分页的显示的。首先就来简单的实现一个,显示出来上一页和下一页,中间是分页数字的例子。

本文最早发表于本人博客: Laravel5.1+ 分页Pagination解析以及扩展

Laravel 的分页很方便,其实扩展起来也挺容易的,下面就来做个示例,扩展一下paginate() simplePaginate()方法,来实现我们自定义分页样式,比如显示"上一页""下一页",而不是"《""》",当然扩展的方法掌握了你就可以肆无忌惮的扩展一个你想要的分页了,比如跳转到某一页,分页显示一共多少记录,当前显示的记录范围等等巴拉巴拉的。。。

5.1和5.2应该是同样的方法,我这里用的是5.2的版本。文档告诉我们Paginator 对应于查询语句构造器和 Eloquent 的 simplePaginate 方法,而 LengthAwarePaginator则等同于 paginate 方法。那我们还是来看下源码,具体这个 paginate 是如何实现render()的,

Illuminate/Pagination/LengthAwarePaginator.php

render();
    }
......
}

render()中传入的是一个Presenter的实例,并调用这个实例化的render方法来实现分页的显示的。如果没有则调用BootstrapThreePresenterrender()的,来看看BootstrapThreePresenter是干嘛的

Illuminate/Pagination/BootstrapThreePresenter.php

paginator = $paginator;
        $this->window = is_null($window) ? UrlWindow::make($paginator) : $window->get();
    }

    /**
     * Determine if the underlying paginator being presented has pages to show.
     *
     * @return bool
     */
    public function hasPages()
    {
        return $this->paginator->hasPages();
    }

    /**
     * Convert the URL window into Bootstrap HTML.
     *
     * @return IlluminateSupportHtmlString
     */
    public function render()
    {
        if ($this->hasPages()) {
            return new HtmlString(sprintf(
                "
    %s %s %s
", $this->getPreviousButton(), $this->getLinks(), $this->getNextButton() )); } return ""; } ...... }

这里可以看到BootstrapThreePresenter实现了PresenterContract 的接口,render() 才是分页显示的真正实现,构造方法中的第一个参数PaginatorContract 其实就是一个Paginator我们继续看下PresenterContract也就是Presenter接口中定义了什么方法需要实现

illuminate/contracts/Pagination/Presenter.php


其中定义了renderhasPages方法需要实现

好了,那我们现在已经很清晰了,我们要自定义分页的显示,那么就要写一个我们自己的Presenter来实现接口中的render()hasPages()就可以了。

首先就来简单的实现一个paginate(),显示出来"上一页"和"下一页",中间是分页数字的例子。

新建文件如下(个人习惯)app/Foundations/Pagination/CustomerPresenter.php

paginator = $paginator;
        $this->window = is_null($window) ? UrlWindow::make($paginator) : $window->get();
    }

    /**
     * Determine if the underlying paginator being presented has pages to show.
     *
     * @return bool
     */
    public function hasPages()
    {
        return $this->paginator->hasPages();
    }

    /**
     * Convert the URL window into Bootstrap HTML.
     *
     * @return IlluminateSupportHtmlString
     */
    public function render()
    {
        if ($this->hasPages()) {
            return new HtmlString(sprintf(
                "
    %s %s %s
", $this->getPreviousButton("上一页"),//具体实现可以查看该方法 $this->getLinks(), $this->getNextButton("下一页")//具体实现可以查看该方法 )); } return ""; } /** * Get HTML wrapper for an available page link. * * @param string $url * @param int $page * @param string|null $rel * @return string */ protected function getAvailablePageWrapper($url, $page, $rel = null) { $rel = is_null($rel) ? "" : " rel="" . $rel . """; return "
  • " . $page . "
  • "; } /** * Get HTML wrapper for disabled text. * * @param string $text * @return string */ protected function getDisabledTextWrapper($text) { return "
  • " . $text . "
  • "; } /** * Get HTML wrapper for active text. * * @param string $text * @return string */ protected function getActivePageWrapper($text) { return "
  • " . $text . "
  • "; } /** * Get a pagination "dot" element. * * @return string */ protected function getDots() { return $this->getDisabledTextWrapper("..."); } /** * Get the current page from the paginator. * * @return int */ protected function currentPage() { return $this->paginator->currentPage(); } /** * Get the last page from the paginator. * * @return int */ protected function lastPage() { return $this->paginator->lastPage(); } }

    就这么简单,主要就是render()方法,如果项目中需要修改分页样式,或者添加分页跳转之类的需求只要重写其中的各项显示的方法中的html元素就可以了,很灵活,在blade模板中也需要修该,比如我们的Paginator$users,默认的分页显示是这样的:

    {!! $users->render() !!}

    修改成我们自定义后的分页显示:

    {!! with(new AppFoundationsPaginationCustomerPresenter($categories))->render() !!}

    好了,这样在页面应该就可以看到分页链接中含有 "上一页"和"下一页"加数字的样式了。

    那么如果扩展simplePaginate?其实很简单,只要继承刚才的CustomerPresenter,实现hasPagesrender,至于为什么可以按照我上面查看源码的方式看一下就知道了,比如我们改成"上一篇"和"下一篇"

    新建AppFoundationsPaginationCustomerSimplePresenter.php

    paginator = $paginator;
        }
    
        /**
         * Determine if the underlying paginator being presented has pages to show.
         *
         * @return bool
         */
        public function hasPages()
        {
            return $this->paginator->hasPages() && count($this->paginator->items()) > 0;
        }
    
        /**
         * Convert the URL window into Bootstrap HTML.
         *
         * @return IlluminateSupportHtmlString
         */
        public function render()
        {
            if ($this->hasPages()) {
                return new HtmlString(sprintf(
                    "
      %s %s
    ", $this->getPreviousButton("上一篇"), $this->getNextButton("下一篇") )); } return ""; } }

    分页显示:

    {!! with(new AppFoundationsPaginationCustomerSimplePresenter($categories))->render() !!}

    方法就是这个方法,具体修改按照自己需求重写其中对应的显示html元素的方法就可以了。

    如果觉得本篇文章对您十分有益,何不 打赏一下

    文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

    转载请注明本文地址:https://www.ucloud.cn/yun/21556.html

    相关文章

    • 常用列表页常见hook封装解析

        我们今天来讲讲关于ahooks 源码,我们目标主要有以下几点:  深入了解 React hooks。  明白如何抽象自定义 hooks,且可以构建属于自己的 React hooks 工具库。  小建议:培养阅读学习源码的习惯,工具库是一个对源码阅读不错的选择。  列表页常见元素  后台管理系统中常见典型列表页包括筛选表单项、Table表格、Pagination分页这三部分。  针对使用 Ant...

      3403771864 评论0 收藏0
    • 全栈通用分页查询

      摘要:前言给大家讲解全栈通用分页查询码字不易,点个关注转载请说明开发工具思维导图目录一所需要的包二后端数据库帮助类通用查询分页父类书籍层类分页工具类三前端文件助手类前端界面四一所需要的包二后端数据库 前言:给大家讲解全栈通用分页查询 码字不易,点个关注 转载请说明! 开发工具:eclipse 思维...

      Ashin 评论0 收藏0
    • 小程序分页实践:编写可复用分页组件

      摘要:项目中遇到切换列表,每个都需要分页的需求,分页流程具有相似性,于是想将分页封装为组件,方便应用。组件的复用完成了以上组件,在对其他分页的页面,可以直接复用。 项目中遇到 tab切换列表,每个tab都需要分页的需求,分页流程具有相似性,于是想将分页封装为组件,方便应用。 组件的应用已写成一个小demo,效果如下图所示(数据用mock模拟): showImg(https://segment...

      crelaber 评论0 收藏0
    • 重写yii2的数据提供器ArrayDataProvider类

      摘要:再看看另一个方法,的提供的数据统计总条数的方法是的,默认计算分页总数是根据数组计算的,而的数据就是我们查询赋值给提供器的。统计总数预处理函数直接获取通过函数获取传递给数据提供器的数据总和。 首先看看ArrayDataProvider官方的doc: ArrayDataProvider implements a data provider based on a data array.Ar...

      xiaokai 评论0 收藏0

    发表评论

    0条评论

    最新活动
    阅读需要支付1元查看
    <