老问题 搜索分页时 第一页显示搜索的,第二页显示全部数据

问题:如图所示,当我搜索数据过多,显示多页等情况下去点击第二页、第三页等,这时页面会跳转到原来页面的第二页

需求:搜索后点击第二页显示的应该是搜索后数据而不是原来页面的第二页

<!-- 顶部搜索区域 -->
		<el-form ref="searchForm" :model="searchCLassRoomQueryInfo" :rules="searchFormRules" :inline="true" class="demo-form-inline">
			<el-form-item prop="classroom_name">
				<el-input v-model="searchCLassRoomQueryInfo.classroom_name" placeholder="教室名称" value=""/>
			</el-form-item>
			<el-form-item>
				<el-button type="primary" @click="queryScreenSemesterData">查询</el-button>
				<el-button @click="searchClassRoomList">查看全部教室</el-button>
			</el-form-item>
		</el-form>
<!-- 页码切换 -->
			<div class="bottomPaginationaa">
				<el-pagination :current-page.sync="searchCLassRoomQueryInfo.page" :page-sizes="[6, 10, 15]" :page-size="searchCLassRoomQueryInfo.limit"
				 layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
			</div>
// 处理分页切换
			handleSizeChange(val) {
				this.searchCLassRoomQueryInfo.limit = val
				this.searchClassRoomList()
			},
			handleCurrentChange(val) {
				this.searchCLassRoomQueryInfo.page = val
				this.searchClassRoomList()
			},
// 条件查询
      async queryScreenSemesterData () {
        if (this.searchCLassRoomQueryInfo.classroom_name == '') {
          this.$message.error('请输入要查询的条件并且在页数为第一页才能查询!')
        } else {
          let queryData = {
            classroom_name: this.searchCLassRoomQueryInfo.classroom_name,
            page:this.searchCLassRoomQueryInfo.page,
            limit:this.searchCLassRoomQueryInfo.limit
          }
          if(queryData.classroom_name){
            queryData.page = 1,
            queryData.limit = 10
            // this.searchCLassRoomQueryInfo.page = 1,
            // this.searchCLassRoomQueryInfo.limit = 10
          }
          console.log(queryData)
          let resData = await searchClassRoom(queryData)
          if (resData.code == 200) {
            this.$message.success('查询成功!')
            this.classShowTable = resData.data
            this.total = resData.data.total
            this.searchClassRoomList()
          } else {
            this.$message.error('查询失败!')
          }
        }
      },

这是搜索过后的效果图

分页是后端实现吗?

 

if(queryData.classroom_name){
            queryData.page = 1,
            queryData.limit = 10,
            this.searchCLassRoomQueryInfo.page = 1;
            this.searchCLassRoomQueryInfo.limit = 10
}

你这样写,有class_name搜索条件时,永远只能查到第一页的内容