element-ui分页里面直接复制就好
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:page-sizes="[2, 3, 5, 7]"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
>
</el-pagination>
data() {
return {
total: 0,
pagenum: 2,
pagesize: 1,
}
}
handleSizeChange(val) {
this.pagenum = val;
this.showCom();
//调用方法,实现数据刷新
},
handleCurrentChange(val) {
this.pagesize = val;
this.showCom();
//调用方法,实现数据刷新
},
上面直接复制即可,下面是从后端请求过来的数据,把pagenum和pagesize传过去
async showCom() {
var r = await this.http.get("http://127.0.0.1:3000/combo/showCombo",
{
params: {
pagenum: this.pagenum,
pagesize: this.pagesize,
},
});
console.log(r);
if (r.data.code == 200) {
this.tableData = r.data.data;
this.total = r.data.count;
}
},
router.get("/showCombo", async function (req, res) {
var limit = req.query.pagenum;
var page = req.query.pagesize;
var sk = (page - 1) * limit;
var count = await com.count();
var r = await com.find().skip(sk).limit(limit);
res.json({ code: 200, data: r, count });
});