如何使用Laravel实现分页功能
时间:2023-04-19 13:40
Laravel是一款流行的PHP开发框架,提供了许多现代化的特性和便于开发的工具,让开发者可以更加高效地构建网站和应用程序。在开发Web应用过程中,常常需要将查询结果分页展示,这篇文章将介绍如何使用Laravel实现分页功能。 一、分页简介 分页是指将一份大量数据拆分成多个页面进行展示的方法,通常情况下我们会设置显示每页多少条数据,数据量超过该值便会自动翻页。这种方式可以大大减少页面的加载时间和占用带宽,让用户更容易地查看和导航数据。 二、Laravel分页操作 Laravel提供了Paginator类来实现分页功能。我们可以将查询结果对象传递给Paginator的make方法,并指定每页要显示的数据量,就可以获取分页实例。在实例上调用render方法,Laravel即可自动生成分页链接。 下面我们来看具体的代码实现。 运行以下命令安装Laravel: 创建数据库表articles,并插入一些样本数据: 在app/Models目录下创建Article.php文件,并添加以下代码: 在app/Http/Controllers目录下创建ArticlesController.php文件,并添加以下代码: 在resources/views目录下创建articles目录,在该目录下创建index.blade.php文件,并添加以下代码: 分析: 在public/css目录下创建app.css文件,并添加以下代码: 在resources/views/layouts目录下的文件app.blade.php中,加入以下代码: 分析: 访问http://127.0.0.1:8000/articles可以看到我们的文章列表已经展示出来了,而且我们可以通过分页链接的方式在多个页面之间切换。 在这里需要注意的是,我们在控制器中调用paginate方法时,传入的参数2代表了一页要显示几条数据,如果这个值设置得过小,则页面上的分页链接会很多,导致页面混乱;如果这个值设置得过大,则页面展示的数据量会很大,长时间阻塞请求,影响页面的打开速度,甚至会导致内存溢出等问题,所以要根据实际情况谨慎设置。 三、总结 Laravel提供了强大的Paginator类来实现分页功能,只需要使用较少的代码即可轻松实现。本文介绍了如何使用Paginator来分页展示MySQL数据库中的数据。我们还展示了如何在分页结果中使用模型属性。当我们需要在开发网站和应用程序时展示大量数据时,分页是必不可少的功能,它不仅可以极大的提高用户体验,还能有效地减轻服务器的开销。 以上就是如何使用Laravel实现分页功能的详细内容,更多请关注Gxl网其它相关文章!composer create-project --prefer-dist laravel/laravel blog
CREATE TABLE `articles` ( `id` int(10) unsigned NOT NULL AUTO_INCREMENT, `title` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL, `body` text COLLATE utf8mb4_unicode_ci NOT NULL, `created_at` timestamp NULL DEFAULT NULL, `updated_at` timestamp NULL DEFAULT NULL, PRIMARY KEY (`id`)) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
INSERT INTO `articles` (`title`, `body`, `created_at`, `updated_at`) VALUES ('Article 1', 'This is article 1 content', '2021-01-01 12:00:00', '2021-01-01 12:00:00');INSERT INTO `articles` (`title`, `body`, `created_at`, `updated_at`) VALUES ('Article 2', 'This is article 2 content', '2021-01-02 12:00:00', '2021-01-02 12:00:00');INSERT INTO `articles` (`title`, `body`, `created_at`, `updated_at`) VALUES ('Article 3', 'This is article 3 content', '2021-01-03 12:00:00', '2021-01-03 12:00:00');INSERT INTO `articles` (`title`, `body`, `created_at`, `updated_at`) VALUES ('Article 4', 'This is article 4 content', '2021-01-04 12:00:00', '2021-01-04 12:00:00');
<?phpnamespace AppModels;use IlluminateDatabaseEloquentFactoriesHasFactory;use IlluminateDatabaseEloquentModel;class Article extends Model{ use HasFactory; protected $fillable = ['title', 'body']; public function getDateAttribute() { return $this->created_at->format('Y-m-d'); }}
<?phpnamespace AppHttpControllers;use IlluminateHttpRequest;use AppModelsArticle;class ArticlesController extends Controller{ public function index(Request $request) { $articles = Article::paginate(2); return view('articles.index', compact('articles')); }}
@extends('layouts.app')@section('content') <div class="container"> <div class="row"> <div class="col-md-8"> @foreach($articles as $article) <div class="card mb-3"> <div class="card-header"> {{ $article->title }} </div> <div class="card-body"> <p class="card-text">{{ $article->body }}</p> </div> <div class="card-footer text-right"> <small class="text-muted">{{ $article->date }}</small> </div> </div> @endforeach {{ $articles->links() }} </div> </div> </div>@endsection
.card { margin-bottom: 20px;}.pagination { margin-top: 20px;}
<!doctype html><html lang="{{ str_replace('_', '-', app()->getLocale()) }}"><head> <!-- Meta Tags --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>{{ config('app.name') }}</title> <!-- Styles --> <link href="{{ asset('css/app.css') }}" rel="stylesheet"></head><body> <nav class="navbar navbar-expand-md navbar-light bg-white shadow-sm"> <div class="container"> <a class="navbar-brand" href="{{ url('/') }}"> {{ config('app.name') }} </a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="{{ __('Toggle navigation') }}"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarSupportedContent"> <ul class="navbar-nav mr-auto"></ul> <ul class="navbar-nav ml-auto"></ul> </div> </div> </nav> @yield('content') <script src="{{ asset('js/app.js') }}"></script></body></html>