一、是什么

在我们做数据查询的时候，如果数据量很大，比如几万条数据，放在一个页面显示的话显然不友好，这时候就需要采用分页显示的形式，如每次只显示10条数据

要实现分页功能，实际上就是从结果集中显示第110条记录作为第1页，显示第1120条记录作为第2页，以此类推

因此，分页实际上就是从结果集中截取出第M~N条记录

二、如何实现

前端实现分页功能，需要后端返回必要的数据，如总的页数，总的数据量，当前页，当前的数据

复制
1{
2 "totalCount": 1836,   // 总的条数
3 "totalPages": 92,  // 总页数
4 "currentPage": 1   // 当前页数
5 "data": [     // 当前页的数据
6   {
7 ...
8   }
9]

后端采用mysql作为数据的持久性存储

前端向后端发送目标的页码page以及每页显示数据的数量pageSize，默认情况每次取10条数据，则每一条数据的起始位置start为：

复制
1const start = (page - 1) * pageSize

当确定了limit和start的值后，就能够确定SQL语句：

复制
1const sql = `SELECT * FROM record limit ${pageSize} OFFSET ${start};`

上诉SQL语句表达的意思为：截取从start到start+pageSize之间（左闭右开）的数据

关于查询数据总数的SQL语句为，record为表名：

复制
1SELECT COUNT(*) FROM record

因此后端的处理逻辑为：

• 获取用户参数页码数page和每页显示的数目 pageSize ，其中page 是必须传递的参数，pageSize为可选参数，默认为10
• 编写 SQL 语句，利用 limit 和 OFFSET 关键字进行分页查询
• 查询数据库，返回总数据量、总页数、当前页、当前页数据给前端

代码如下所示：

复制
1router.all('/api', function (req, res, next) {
2  var param = '';
3  // 获取参数
4  if (req.method == "POST") {
5    param = req.body;
6  } else {
7    param = req.query || req.params;
8  }
9  if (param.page == '' || param.page == null || param.page == undefined) {
10    res.end(JSON.stringify({ msg: '请传入参数page', status: '102' }));
11    return;
12  }
13  const pageSize = param.pageSize || 10;
14  const start = (param.page - 1) * pageSize;
15  const sql = `SELECT * FROM record limit ${pageSize} OFFSET ${start};`
16  pool.getConnection(function (err, connection) {
17    if (err) throw err;
18    connection.query(sql, function (err, results) {
19      connection.release();
20      if (err) {
21        throw err
22      } else {
23        // 计算总页数
24        var allCount = results[0][0]['COUNT(*)'];
25        var allPage = parseInt(allCount) / 20;
26        var pageStr = allPage.toString();
27        // 不能被整除
28        if (pageStr.indexOf('.') > 0) {
29          allPage = parseInt(pageStr.split('.')[0]) + 1;
30        }
31        var list = results[1];
32        res.end(JSON.stringify({ msg: '操作成功', status: '200', totalPages: allPage, currentPage: param.page, totalCount: allCount, data: list }));
33      }
34    })
35  })
36});

三、总结

通过上面的分析，可以看到分页查询的关键在于，要首先确定每页显示的数量pageSize，然后根据当前页的索引pageIndex（从1开始），确定LIMIT和OFFSET应该设定的值：

• LIMIT 总是设定为 pageSize
• OFFSET 计算公式为 pageSize * (pageIndex - 1)

确定了这两个值，就能查询出第 N页的数据