vue2.0多条件搜索组件使用详解(3)

1、为保证点击加号出来的select标签的v-model不一样,讲v-model与v-for的item绑定;<divclass="formtips" v-for="(item,index) in formtips">
<selectclass="formcontrol" v-model="item.titletype" >

2、当点击减号使搜索条件只剩下一列时,减号消失 <spanclass="tipsicon removeminus" @click="removeminus"   v-show="formtips.length>=4" ></span>;同理给加号增加条件,通过长度判断,限制增加的检索条件最多为6列,加号消失

3、点击检索后,使选中的检索条件通过

let body={ formtips:this.formtips, cataloglist:this.cataloglist, timestart:this.timestart, timeend:this.timeend }

body传递
默认

高级搜索

vue2.0多条件搜索组件使用详解

作者搜索

vue2.0多条件搜索组件使用详解

点击减号

vue2.0多条件搜索组件使用详解

筛选条件三列,点击检索

vue2.0多条件搜索组件使用详解

控制台输出,点击检索要传的值body

vue2.0多条件搜索组件使用详解

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wysspz.html