vue之精准查询和模糊查询

之前做查询精准和模糊查询都是后台传值过来，最近接触了一个前端操作的方法，觉得很不错，下面将这个方法分享给大家，希望可以对你有所帮助！

示例：

<el-form :inline="true" :model="formInline" class="demo-form-inline">
  <el-form-item label="审批人">
    <el-input v-model="formInline.user" placeholder="审批人"></el-input>
  </el-form-item>
  <el-form-item label="活动区域">
    <el-select v-model="formInline.region" placeholder="活动区域">
      <el-option
        v-for="(item, index) in typeOptions"
          :key="index"
          :label="item.value"
          :value="item.code"
      ></el-option>
    </el-select>
  </el-form-item>
  <el-form-item>
    <el-button type="primary" @click="onSubmit">查询</el-button>
  </el-form-item>
</el-form>
<script>
  export default {
    data() {
      return {
        formInline: {
          user: '',
          region: ''
        },
        typeOptions: []
      }
    },
    methods: {
      onSubmit() {
       if (this.formInline.user) {
	       	let filters = [];
	          let user= this.tableSearchNode(
	              'user',
	              'like', // 模糊查询
	              [this.formInline.user],
	              'String'
	          );
	          filters.push([user]);
	      }
     if (this.formInline.region.length) {
                let tmpArr = [];
                for (let k = 0; k < this.formInline.region.length; k++) {
                    let region= this.tableSearchNode(
                        'region',
                        'eq', // 精准查询
                        [this.formInline.region[k]],
                        'String'
                    );
                    tmpArr.push(region);
                }
                filters.push(tmpArr);
            }
      }
      // 下面就调用你获取列表的接口就可以啦
    }
  }
</script>

总结

这个方法我就得很好，用起来很方便，想要精准查询就“eq”,想要模糊查询就用“like”，但是唯一一点不好就是，搜索的条件多了之后，代码比较多，其余都比较好，所以针对你的项目，择优处理，哪个方便适合，你就选哪个，在我看来，第一步目的是功能实现，其次才是代码的质量。

标签：vue,region,查询,let,user,formInline,精准
来源： https://blog.csdn.net/FannyIf123/article/details/111247456