后端数据(Eloquent 模型)分页

事先建立好Eloquent 模型和Controller 还有 前台的View。可以参考我之前的文章:Laravel建站03--建立前台文章列表和文章详情

在controller 里获取分页数据:

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Illuminate\Support\Facades\DB;
use App\Article; use Illuminate\Support\Facades\Cache;
use Carbon\Carbon; class ArticleController extends Controller
{
public function index()
{
//方式一:可以用DB facade 进行接近原生SQL方式查询,也可以完全用SQL语句,如:$users = DB::select('select * from users where active = 1');。不过我得这样不好
// $articles = DB::table('articles')
// ->select('id', 'body', 'title')
// ->orderBy('id', 'desc')
// ->paginate(5); //分页的关键,这里是可以显示页码的分页,也可以用简单分页,只显示上一页,下一页。数据量大时,简单分页会更快
//方式二:模型直接分页
//$articles = Article::paginate(5);
//方式三:模型简单分页
//$articles = Article::simplePaginate(5);
//在方式二的基础上增加排序规则
//$articles = Article::orderBy('id', 'desc')->paginate(5);
//在方式三的基础上增加查询的列
$articles = Article::select('id', 'title')->orderBy('id', 'desc')->paginate(5);
return view('welcome', ['articles' => $articles]);
}
}

前台显示分页结果

  • 在Laravel中显示分页HTML还是很简单的。只用一句话就可以搞定:
{{ $articles->links() }}
  • 如果想在前台分页连接中附加参数,可以在controller绑定view中增加参数:
return view('welcome', ['articles' => $articles, 'params1' => 'a', 'params2'=>'b']);

  然后把前台的代码修改为:

{{ $articles->appends(['p1' => $params1, 'p2' => $params2])->links() }}

  这样前台分页的地址就从?page=2 变成?p1=a&p2=b&page=2 了。

  • 自定义分页HTML

  想自定义分页HTML,可以修改Laravel分页视图:vendor/laravel/framework/src/Illuminate/Pagination/resources/views/ 文件夹下的视图文件

Laravel 5.4---后端数据分页和前端显示分页结果的更多相关文章

  1. Python Django 前后端数据交互 之 前端向后端发送数据

    Python Django 之 前端向后端发送数据

  2. Django框架之模板语言特殊标记(将后端的数据显示到前端)

    后端代码 def GetMain(request): return render( request, "main.html", { "user1":" ...

  3. Django项目:CRM(客户关系管理系统)--22--14PerfectCRM实现King_admin分页的省略显示

    {#table_data_list.html#} {## ————————08PerfectCRM实现King_admin显示注册表的字段表头————————#} {% extends 'king_m ...

  4. php分页类代码带分页样式效果(转)

    php分页类代码,有漂亮的分页样式风格 时间:2016-03-16 09:16:03来源:网络 导读:不错的php分页类代码,将类文件与分页样式嵌入,实现php查询结果的精美分页,对研究php分页原理 ...

  5. 前端paging分页,前端设置每页多少条和当前页面的索引,传给后端,数据显示出来

    1.首先引入jquery 2.在引入paging.css和paging.js  这2个我存在百度云上: 链接:https://pan.baidu.com/s/1SPxlBkkx-pNAtLuRLifE ...

  6. 本博文将一步步带领你实现抽屉官网的各种功能:包括登陆、注册、发送邮箱验证码、登陆验证码、页面登陆验证、发布文章、上传图片、form验证、点赞、评论、文章分页处理以及基于tronado的后端和ajax的前端数据处理。

    本博文将一步步带领你实现抽屉官网的各种功能:包括登陆.注册.发送邮箱验证码.登陆验证码.页面登陆验证.发布文章.上传图片.form验证.点赞.评论.文章分页处理以及基于tronado的后端和ajax的 ...

  7. 循序渐进VUE+Element 前端应用开发(4)--- 获取后端数据及产品信息页面的处理

    在前面随笔<循序渐进VUE+Element 前端应用开发(3)--- 动态菜单和路由的关联处理>中介绍了在Vue + Element整合框架中,实现了动态菜单和动态路由的处理,从而可以根据 ...

  8. 循序渐进VUE+Element 前端应用开发(30)--- ABP后端和Vue+Element前端结合的分页排序处理

    在很多列表展示数据的场合中,大多数都会需要一个排序的处理,以方便快速查找排序所需的数据,本篇随笔介绍如何结合ABP后端和Vue+Element前端结合的分页排序处理过程. 1.Vue+Element前 ...

  9. 向.net后端发送请求获取数据,在前端动态填充表格

    实现效果 实现步骤 通过Ajax请求的方式 1.在前端定义Table 2.通过Ajax向.net后端发送数据请求 3.在.net后端定义方法供前端调用,并返回所需的数据 4.通过构造字符串的方式,将后 ...

随机推荐

  1. 1.docker学习

    Docker —— 从入门到实践 http://udn.yyuap.com/doc/docker_practice/introduction/index.html 非常详细的Docker学习教程 ht ...

  2. 【10】react 之 react-router

    1.1.  路由 路由:URL与处理器的映射. 浏览器当前的 URL 发生变化时,路由系统会做出一些响应,用来保证用户界面与 URL 的同步. 1.2.  Router安装 npm i react-r ...

  3. mybatis 关联查询时,从表只返回第一条记录解决办法

    如果两表联查,主表和明细表的主键都是id的话,明细表的多条只能查询出来第一条. 造成以上情况可能的原因: 1.级联查询的时候,主表和从表有一样的字段名的时候,在mysql上命令查询是没问题的.但在my ...

  4. android的布局-----FrameLayout(帧布局)

    (-)帧布局简介 帧布局容器为每个加入的其中的组件创建一个空白的区域称为一帧每个子组件占据一帧,这些帧都会根据gravity的属性执行自动对齐 (二)属性 foreground:这是帧布局的前景图像 ...

  5. 《Linux命令行与shell脚本编程大全 第3版》Linux命令行---52

    以下为阅读<Linux命令行与shell脚本编程大全 第3版>的读书笔记,为了方便记录,特地与书的内容保持同步,特意做成一节一次随笔,特记录如下:

  6. win10下怎么配置以KDiff3作为merge tool和diff tool

    系统环境: OS: Windows 10 Git 2.6.1.windows.1 KDiff3 0.9.98 (64 bit) 具体代码如下: git config --global --add me ...

  7. macro expand error

    cat test_macro.c #define TEST_MACRO(b) chip->##b int main(void) { TEST_MACRO(yyy) return 0; } gcc ...

  8. layui 自定义表单验证 以及提交表单

    订购数量</span> <span style="color: red">*</span>: <input type="text ...

  9. 小型web项目的模块化(转)

    背景   目前团队中新的 Web 项目基本都采用了 Vue 或 React ,加上 RN,这些都属于比较重量级的框架,然而对于小型 Web 页面,又显得过大.早期的一些项目则使用了较原始的 HTML ...

  10. jquery 中的post和get方法同步问题

    解决方法: 在需要同步的js代码前修改ajax的async属性. 有两种设置方法: 1: $.ajaxSettings.async = false; 2: $.ajaxSetup({ async : ...