大家好，又见面了，我是你们的朋友全栈君。
文章目的实现laravel分页样式的修改：（样式有点丑）
以laravel的默认表users表为例，插入100条数据
$arr = [];
for($i=0;$i<100;$i++){
$arr[] = ['name'=>'NAME_'.$i,'email'=>"email@{$i}.com",'password'=>$i,'created_at'=>date('Y-m-d H:i:s'),'updated_at'=>date('Y-m-d H:i:s')];
}
DB::table('users')->insert($arr);
查询数据渲染到模板
public function test(){
$users = DB::table('users')->paginate(10);
return view('paginate',['users'=>$users]);
}
新建paginate.blade.php文件
<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css">
<style>
table td,th {
border: 1px solid #e5e5e5;
padding: 8px;
}
.table{
width: 100%;
margin-left: 20%;
}
</style>
</head>
<body>
<div >
<div class="table">
<h1>用户列表</h1>
<table>
<thead>
<tr>
<th>序号</th>
<th>名称</th>
<th>email</th>
<th>创建时间</th>
<th>修改时间</th>
</tr>
</thead>
<tbody>
@foreach($users as $user)
<tr>
<td>{
{$loop->iteration}}</td>
<td>{
{$user->name}}</td>
<td>{
{$user->email}}</td>
<td>{
{$user->created_at}}</td>
<td>{
{$user->updated_at}}</td>
</tr>
@endforeach
</tbody>
</table>
{
{$users -> links()}}
</div>
</div>
</body>
</html>
此时的分页为laravel默认的效果
使用 vendor:publish 命令导出视图文件到resources/views/vendor 目录
php artisan vendor:publish --tag=laravel-pagination
生成多种分页样式模板文件
此时默认使用pagination文件的第一个分页样式 bootstrap-4.blade.php
Paginator::defaultView(‘vendor.pagination.default’); 可以切换其他的样式
修改箭头符号为 上一页
修改后效果：
加一个跳转页数的输入框
分页blade的代码：
<style>
.pagination select {
width: 110px;
margin-top: -24px;
}
.pagination li{
display: inline-block;
}
.pagination input{
width: 50px;
}
</style>
@if ($paginator->hasPages())
<ul class="pagination">
{
{--添加分页数量选择--}}
<li class="page-item">
<select class="form-control" name="perPage" >
<option value="10" selected>10条/页</option>
<option value="20" selected>20条/页</option>
<option value="50" selected>50条/页</option>
<option value="100" selected>100条/页</option>
</select>
</li>
{
{-- Previous Page Link --}}
@if ($paginator->onFirstPage())
{
{--<li class="page-item disabled"><span class="page-link">‹</span></li>--}}
<li class="page-item disabled"><span class="page-link">上一页</span></li>
@else
{
{--<li class="page-item"><a class="page-link" href="{
{ $paginator->previousPageUrl() }}" rel="prev">‹</a></li>--}}
<li class="page-item"><a class="page-link" href="{
{ $paginator->previousPageUrl() }}" rel="prev">上一页</a></li>
@endif
{
{-- Pagination Elements --}}
@foreach ($elements as $element)
{
{-- "Three Dots" Separator --}}
@if (is_string($element))
<li class="page-item disabled"><span class="page-link">{
{ $element }}</span></li>
@endif
{
{-- Array Of Links --}}
@if (is_array($element))
@foreach ($element as $page => $url)
@if ($page == $paginator->currentPage())
<li class="page-item active"><span class="page-link">{
{ $page }}</span></li>
@else
<li class="page-item"><a class="page-link" href="{
{ $url }}">{
{ $page }}</a></li>
@endif
@endforeach
@endif
@endforeach
{
{-- Next Page Link --}}
@if ($paginator->hasMorePages())
{
{--<li class="page-item"><a class="page-link" href="{
{ $paginator->nextPageUrl() }}" rel="next">›</a></li>--}}
<li class="page-item"><a class="page-link" href="{
{ $paginator->nextPageUrl() }}" rel="next">下一页</a></li>
@else
{
{--<li class="page-item disabled"><span class="page-link">›</span></li>--}}
<li class="page-item disabled"><span class="page-link">下一页</span></li>
@endif
<li>
<strong> 跳转到：</strong>
</li>
<li>
<input class="form-control">
</li>
<li>
<strong> 页</strong>
</li>
</ul>
@endif
附：
每个分页器实例都可以通过以下方法提供更多分页信息：
$results->count()
$results->currentPage()
$results->firstItem()
$results->hasMorePages()
$results->lastItem()
$results->lastPage() (使用simplePaginate 时无效)
$results->nextPageUrl()
$results->perPage()
$results->previousPageUrl()
$results->total() (使用simplePaginate 时无效)
$results->url($page)
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
发布者：全栈程序员-用户IM，转载请注明出处：https://javaforall.cn/160649.html原文链接：https://javaforall.cn
【正版授权，激活自己账号】： Jetbrains全家桶Ide使用，1年售后保障，每天仅需1毛
【官方授权 正版激活】： 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...