VUE+element+springboot+mysql的分页功能

欢迎使用Markdown编辑器

在这里插入图片描述

一、导入分页组件
<el-pagination
background
:current-page.sync=“Page”
small
layout=“prev, pager, next”
:page-size=“pageSize”
:total=“total”
@current-change=“current_change”>

总记录数：{ {total}}
二、在data创建参数
table:[],
pageSize:1,//每页多少数据
Page:1, //默认当前页为第一页
total: 1//默认总数量是0
三、发送两个 请求 一个是根据 page\pageSize查询数据 另一个是查询数据的总数。创建current_change方法。
const _this = this;
let page =（page-1）*pageSize
this.axios.get(‘http://localhost:9999/pharmacy’, {
params: {
page: page,//当前页
pageSize: _this.pageSize
}
}).then(function (res) {
_this.table=res.data;}//将返回的数据赋值给table 在页面展示
//查询总数
this.a