Vue常见页面（管理+详情+编辑+新增）三、如何获取下拉框中的枚举值+分页查询

如何获取下拉框中的枚举值

      <el-form-item label="测试单状态">            <el-select v-model="value" placeholder="请选择" clearable @change="changeStatus">   <el-option   v-for="(item, index) in options"   :key="item.status_yn"   :label="item.status_name"   :value="`${item.status_yn}-${index}`">   </el-option>    </el-select>      </el-form-item>

methods里的changeStatus方法

      //选择测试单状态 changeStatus(e){  //首先获取index下标  const index = e.split('-')[1]  // 然后将查询时候用的参数体，赋值为options里对应下标的status_yn的值  this.queryParam.status_yn = this.options[index].status_yn  console.log(this.queryParam)     }

分页查询

实现点击不同页码查询对应的数据
首先从element-ui找到对应的代码过来，我选择了这种

          <el-pagination  :page-size="queryParam.pageSize"  background  layout="prev, pager, next"  :total=this.total  @current-change="handleCurrentChange"></el-pagination>

methods里的handleCurrentChange方法

      // 监听页码值改变事件      handleCurrentChange(currentPage){ // 改变当前页码 console.log(currentPage) this.queryParam.pageNo = currentPage; console.log(this.queryParam.pageNo) // 重新获取数据 console.log(this.queryParam), queryAapplicationListApi(this.queryParam).then(response=>{   this.tableData=response.result.list   console.log(this.tableData) this.getTableData() })      }