1. 在模板文件中引入分页插件及其依赖。
代码语言：javascript复制<!-- 引入插件和插件的依赖-->
<link rel="stylesheet" href="/public/admin/bootstrap/css/bootstrap.css">
<script type="text/javascript" src="/public/admin/bootstrap/js/jquery-1.10.1.js"></script>
<script type="text/javascript" src="/public/admin/bootstrap/js/bootstrap.min.js"></script>
<script src="/public/admin/jqPaginator/jqPaginator.js"></script>2. 在模板文件中指定分页的容器。
代码语言：javascript复制<!-- 指定分页的容器,依赖于BootStrap的样式pagination -->
<!-- https://v3.bootcss.com/components/#pagination -->
<div id="pagination" class="pagination" style="margin:0;"></div>3. 在模板文件中调用分页插件。
代码语言：javascript复制// 调用分页插件，使用EJS模板渲染总页数与当前页
$('#pagination').jqPaginator({
totalPages: <%= totalPages %>,
visiblePages: 10,
currentPage: <%=page %>,
onPageChange: function (num, type) {
// 区分初始化加载与点击加载
if (type == 'change') {
kk = "/admin/goods?page=" num;
}
}
});4. 定义路由。
代码语言：javascript复制// router.js
'use strict';
module.exports = app => {
const { router, controller } = app;
// 商品管理
router.get('/admin/goods',controller.admin.goods.index);
};5. 定义控制器。
代码语言：javascript复制// app/controller/admin/goods.js
'use strict';
const Controller = require('egg').Controller;
class GoodsController extends Controller {
// 商品列表
async index() {
let page = this.ctx.query.page || 1;
let pagesize = 10;
// 查询Goods表中的总数量
let totalNum = await this.ctx.model.Goods.find({}).count();
// 按分页查询Goods表中的数据
let goodsResult = await this.ctx.model.Goods.find({}).skip((page - 1) * pagesize).limit(pagesize);
await this.ctx.render('admin/goods/index', {
list: goodsResult,
page: page,
totalPages: Math.ceil(totalNum / pagesize),
});
}
}
module.exports = GoodsController;
