前言
【之前写过 单条件查询的功能,这次算是把之前的文章补足,让这个功能更加完善一点。】
一、多条件查询是什么?
【相比于单条件而言,多条件查询更加科学,即:多个表单控件(input、select等)发生数据交互的时候,下面的tableData数据在展示的时候,会更加的 具体化、综合化】
再也不会像之前一样,稚嫩、局限
二、相关步骤:
1.所有表单控件数据v-model一下
<el-input
size="mini"
v-model="param_search.id"
placeholder="请输入内容"
></el-input>
此处省略其他的 表单控件
2.按钮绑定click事件,写search函数
search() {
加了个 loading效果,不喜欢可以不加
const loading = this.$loading({
lock: true,
text: "Loading",
spinner: "el-icon-loading",
background: "rgba(0, 0, 0, 0.7)",
});
这里做了个数据暂存,原因是因为 切换分页的时候,表单控件已经选定的值会改变,(抄师父的代码,他是这样说的哈哈)
this.cache_search 和 this.param_search 完全一样,只不过后者v-model了而已
this.cache_search.time = this.param_search.time;
this.cache_search.name = this.param_search.name;
this.cache_search.region = this.param_search.region;
this.cache_search.type = this.param_search.type;
this.cache_search.a