【vue 项目】element复合型输入框 根据判断向接口传递不同参数

先上图
在这里插入图片描述
做查询列表的时候遇到了这样的问题,
接口请求参数除了两个必传的分页查询参数,
还有三个选择性传参是上面复合型输入框向接口传递搜索值进行模糊查询要用的

复合型输入框前有个选择框,对查询内容进行限定
在这里插入图片描述
接口请求参数
产品名称:
产品厂商:
产品型号:

起初将input输入框v-model值直接传值
产品名称:v-model
产品厂商:v-model
产品型号:v-model
导致原本只是选择一个条件进行查询,变成要同时满足三个条件

后来想请后端帮忙改成两个字段,
一个存 产品查询条件
一个存 input内容
最后还是按着原先的字段

	  // 搜索框判断
	  // proSelect是select框的值 v-model="proSelect"
	  // search是input框的值 v-model="search"
	  // search1 search2 search3 已在data中定义
      if (this.proSelect === '1') {
    
    
        this.search1 = this.search
      }
      if (this.proSelect === '2') {
    
    
        this.search2 = this.search
      }
      if (this.proSelect === '3') {
    
    
        this.search3 = this.search
      }
      // 准备参数
      const option = {
    
    
        pageNo: this.pager.page,
        pageSize: this.pager.limit,
        manufacturer: this.search2,
        model: this.search3,
        productName: this.search1
      }

小白 小白 自行参考

猜你喜欢

转载自blog.csdn.net/Aohanzzz/article/details/126701320