vue+elementui+axios中，前端通过表单向后端传送数据

<template>

<!-- 查询表单 -->
<el-form :inline="true" :model="querySearch" class="demo-form-inline">
<el-form-item label="站点名称">
<el-input
  v-model="queryParams.stationName"
   placeholder="站点名称"
   ></el-input>
   </el-form-item>
    <el-form-item label="站点状态">
   <el-select v-model="queryParams.status" placeholder="站点状态">
  <el-option label="正常" value="0"></el-option>
  <el-option label="禁用" value="1"></el-option>
   </el-select>
    </el-form-item>
   <el-form-item>
   el-button type="primary" @click="querySearch">查询</el-button>
</el-form-item>
</el-form>
</template>

<script>

  data() {
    return {
      tableData: [],
      multipleSelection: [],
      queryParams: {
        stationName: undefined,
        status: undefined,
      },
      pageNum: 1,
      pageSize: 10,
      total: null,
    };
  },

methods: {
// 获取数据
    getData() {
      axios
        .get("http://localhost:8989/system/station/list", {
          params: {
            pageNum: this.pageNum,
            pageSize: this.pageSize,
            stationName: this.queryParams.stationName,
            status: this.queryParams.status,
          },
        })
        .then((res) => {
          this.tableData = res.data.data.rows;
          this.total = res.data.data.total;
        });
    },
    querySearch() {
      this.stationName = decodeURI(this.queryParams.stationName); // 重点，如果有中文，要注意编码
      this.status = this.queryParams.status;
      this.getData();
    },
}
// 钩子函数
mounted() {
    this.getData();
  },
</script>