vue实现搜索后t查询结果的分页显示,点击下一页时不能记住所查询的数据

Question

问题描述

vue实现搜索出来数据后点击下一页返回的直接是全部数据的第二页，而不是搜索出来结果的第二页

相关代码

    <el-pagination
      background
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="currentPage"
      :page-size="pagesize"
      class="paging"
      layout="total, sizes,prev, pager, next, jumper"
      :total="total"
    ></el-pagination>
  
  //搜索  
  async searchData() {
  let param = {
    pageNo: this.currentPage, //第几页
    pageSize: this.pagesize, //每页多少条
    key: this.input
  };
  this.currentPage=1;
  let res = await cdService.searchData(param);
  if (res) {
    for (let item of res.data) {
      //判断
      switch (item.difficulty) {
        case 1:
        case 2:
        case 3:
          item.difficulty = "初级";
          break;
        case 4:
        case 5:
        case 6:
          item.difficulty = "中级";
          break;
        case 7:
        case 8:
        case 9:
        case 10:
          item.difficulty = "高级";
          break;
        default:
          item.difficulty = "未知";
          break;
      }
    }
    this.tableData = res.data;
    console.log(res, "res");
    console.log(res.data, "搜索表格中的数据");
  }
},


//题库分页
handleSizeChange(val) {
  console.log(`每页 ${val} 条`);
  this.pagesize = val;
  this.currentPage = 1;
  this.getList(this.currentPage,val);
},
handleCurrentChange(val) {
  console.log(`当前页: ${val}`);
  this.currentPage = val;
  this.getList(val,this.pagesize);
},

你期待的结果是什么？实际看到的错误信息又是什么？

搜索出来的页面是这样的
搜索出的第一页

搜索出的第二页，

第二页就直接没有了查询的结果了，该怎么修改

Answer 1

this.getList方法中应该是没有把请求参数key: this.input实时传入

Answer 2

this.getList是怎么处理的?

Answer 3

遇到了同样的问题，请问如何解决呀？