Laravel使用的过程中,有些功能把前端页面的表达“写死了”,比如分页的翻页按钮!

当然你会说Laravel的Bootstrap样式也很好看啊,但是实际项目中,翻页按钮常常需要满足的客户的需要,特别在开发一款支持手机适配的Web APP,更是需要使用自定义的样式。

所以,学习一样东西不能一知半解,而是究其原理。

先来看看Laravel是怎么分页的,生成分页按钮的代码究竟写在了哪里?

Laravel目录\vendor\laravel\framework\src\Illuminate\Pagination下

先理一下类的继承关系

PresenterContract(父类)

┗BootstrapThreePresenter(子类)<-SimpleBootstrapThreePresenter

┗BootstrapFourPresenter(子类)<-SimpleBootstrapFourPresenter

从作者对类的命名上看,必有区别,我们从代码上研究

BootstrapThreePresenter.php和BootstrapFourPresenter.php主要区别在下列函数

BootstrapThreePresenter.php代码:

 /**
* 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 '<li><a href="'.htmlentities($url).'"'.$rel.'>'.$page.'</a></li>';
}
/**
* Get HTML wrapper for disabled text.
*
* @param string $text
* @return string
*/
protected function getDisabledTextWrapper($text)
{
return '<li class="disabled"><span>'.$text.'</span></li>';
}
/**
* Get HTML wrapper for active text.
*
* @param string $text
* @return string
*/
protected function getActivePageWrapper($text)
{
return '<li class="active"><span>'.$text.'</span></li>';
}

BootstrapFourPresenter.php代码:

/**
* 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 '<li class="page-item"><a class="page-link" href="'.htmlentities($url).'"'.$rel.'>'.$page.'</a></li>';
}
/**
* Get HTML wrapper for disabled text.
*
* @param string $text
* @return string
*/
protected function getDisabledTextWrapper($text)
{
return '<li class="page-item disabled"><a class="page-link">'.$text.'</a></li>';
}
/**
* Get HTML wrapper for active text.
*
* @param string $text
* @return string
*/
protected function getActivePageWrapper($text)
{
return '<li class="page-item active"><a class="page-link">'.$text.'</a></li>';
}

我们发现最大的区别在ThreePresenter几乎是“裸”HTML标签,而FourPresenter生成的是带class的HTML标签。

无论是ThreePresenter还是FourPresenter,他们都有一个相同实现的render()函数

 /**
* Convert the URL window into Bootstrap HTML.
*
* @return \Illuminate\Support\HtmlString
*/
public function render()
{
if ($this->hasPages()) {
return new HtmlString(sprintf(
'<ul class="pagination">%s %s %s</ul>',
$this->getPreviousButton(),
$this->getLinks(),
$this->getNextButton()
));
}
return '';
}

细心的读者已经发觉,还有两个继承类,分别是SimpleThreePresenter和SimpleFourPresenter,既然是Simple(简单),区别就在他们的render()函数

/**
* Convert the URL window into Bootstrap HTML.
*
* @return \Illuminate\Support\HtmlString
*/
public function render()
{
if ($this->hasPages()) {
return new HtmlString(sprintf(
'<ul class="pager">%s %s</ul>',
$this->getPreviousButton(),
$this->getNextButton()
));
}
return '';
}

也就是说,SimpleThreePresenter和SimpleFourPresenter生成的分页按钮是没有“页码”的,只有“上一页”和“下一页”按钮。

 

Laravel分页的更多相关文章

  1. Laravel 分页详解

    Laravel分页很简单,但功能又很强大噢! 首先在控制器的方法中使用paginate(页面显示条数)方法,传入页面显示的条数 然后在模板页面使用方法render()来生成html元素 appends ...

  2. php laravel加密 form表单认证 laravel分页

    use Illuminate\Support\Facades\Crypt; echo Crypt::encrypt(123); //加密echo "<br>";//解密 ...

  3. laravel 分页

    因为Laravel默认使用的是en语言文件所有咱们相应使用中文分页提示的话,可以按如下步骤操作: laravel4------------------------------------------- ...

  4. laravel 分页和共多少条 加参数的分页链接

    <div class="pagers "> <span class="fs pager">共 {{$trades->total() ...

  5. laravel 分页使用

    分页 //对数据库结果分页 $users = DB::table('users')->paginate(15); //可以对 Eloquent 模型分页: $allUsers = User::p ...

  6. Laravel 分页 数据丢失问题解决

    问题: to do list 中有32条数据,每页10条,共3页. 做完了一个事项之后,准备打卡,发现找不到这个事项. 数据库查询正常,有这一条数据. 原因: 发现是分页出了问题,第1页的数据和第2页 ...

  7. 为laravel分页样式制定class

    做的项目有一个上翻页和下翻页,使用了框架提供的

  8. Laravel分页带参数的实现方法

    控制器: $data['type'] = 5;$data['member_list'] = Member::orderBy('id', 'desc')->paginate(10);return ...

  9. laravel 分页带参数

    {{$data->appends(request()->except(['page']))->links()}}

随机推荐

  1. 关于IE6、IE7、IE8实现盒子阴影shadow的几个注意点

    通常,我们实现盒阴影都是通过这段代码来实现的 -moz-box-shadow: 3px 3px 4px #000; -webkit-box-shadow: 3px 3px 4px #000; box- ...

  2. Angular - - ngClass、ngClassEven、ngClassOdd、ngStyle

    这几个都关于样式及类名修改的,所以先把样式代码贴上吧. .red{color:red} .blue{color:blue} 写案例用到的样式就这么简单的两个,下面进入正题. ngClass ngCla ...

  3. IIS HTTP重定向到HTTPS

    最近客户一个网站升级至HTTPS协议访问,但是为了用户输入,客户要求当用户输入的是HTTP协议时,能自动定向到HTTPS,类似百度网站,当你输入www.baidu.com并回车后,地址栏自动变成了ht ...

  4. LIS算法

    LIS(Longest Increasing Subsequence)最长上升(不下降)子序列. 1. O(n^2) #include<cstdio> #include<algori ...

  5. easyUI 添加排序到datagrid

    http://www.cnblogs.com/javaexam2/archive/2012/08/10/2632645.html

  6. 《微信小程序七日谈》- 第六天:小程序devtool隐藏的秘密

    <微信小程序七日谈>系列文章: 第一天:人生若只如初见: 第二天:你可能要抛弃原来的响应式开发思维: 第三天:玩转Page组件的生命周期: 第四天:页面路径最多五层?导航可以这么玩: 第五 ...

  7. 自动化测试框架中关于selenium api的二次封装

    不多说,直接看代码如下: #coding:utf-8 from selenium import webdriver from selenium.webdriver.common.action_chai ...

  8. HDU4734(数位dp)

    F(x) Time Limit: 1000/500 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submiss ...

  9. Intellij IDEA 建立文件夹目录问题

    问题: NEW一个package常出现文件夹层次问题 解决: 1.选中当前文件夹(要在该文件夹下添加): 2.右击此处: 3.添加即可. 链接:http://stackoverflow.com/que ...

  10. Spark:使用Spark Shell的两个示例

    Spark:使用Spark Shell的两个示例 Python 行数统计 ** 注意: **使用的是Hadoop的HDFS作为持久层,需要先配置Hadoop 命令行代码 # pyspark >& ...