vue和pageHelper进行分页的时候,点击搜索按钮回到第一页
分页组件如下<div class="pagination"><el-pagination@size-change="handleSizeChange"@current-change="handleCurrentChange":...
·
分页组件如下
<div class="pagination">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage" //当前页信息
:page-sizes="[10, 20, 30, 40]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalCount">
</el-pagination>
</div>
当前页currentPage
data(){
return{
currentPage:''
}
}
发送请求的loadData
loadData(modelId,seqNum,pageNum,pageSize){
var _this = this;
_this.$http.get('/api/DataDownshift/modelTable/list',{
params:{
modelId:modelId,
seqNum:seqNum,
pageNum:pageNum,
pageSize:pageSize
}
})
.then(function (response) {
var rspCode=response.data.rspCode;
if(rspCode=="200"){
_this.tableData=response.data.data;
_this.totalCount=parseInt(response.data.rspMsg);
}else if(rspCode=="500"){
_this.$message.error("出错了哦,有bug:"+response.data.rspMsg);
}
})
.catch(function (error) {
_this.$message.error("出错了哦,有bug:"+error);
});
},
search查询按钮函数
search(){
var _this=this;
_this.currentPage=1;
_this.loadData(_this.modelId,_this.seqNum, _this.currentPage,_this.pageSize);
},
这里先让当前页为1,然后再进行查询,不然查询的时候loadData中的currentPage为2,查询数据库时是返回第二页的数据,假如pageSize为10,那么返回的是顺序9之后的数据,当查询的数据没有10条的时候,currentPage为2则返回为空。
所以查询都是从第一页开始查的,而不是第二页。点击查询后,页码应该回到1。
更多推荐
已为社区贡献6条内容
所有评论(0)