vue和pageHelper进行分页的时候,点击搜索按钮回到第一页

分页组件如下

<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。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值