扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
本文实例为大家分享了vue实现Input输入框模糊查询方法的具体代码,供大家参考,具体内容如下
创新互联服务项目包括渠县网站建设、渠县网站制作、渠县网页制作以及渠县网络营销策划等。多年来,我们专注于互联网行业,利用自身积累的技术优势、行业经验、深度合作伙伴关系等,向广大中小型企业、政府机构等提供互联网行业的解决方案,渠县网站推广取得了明显的社会效益与经济效益。目前,我们服务的客户以成都为中心已经辐射到渠县省份的部分城市,未来相信会继续扩大服务区域并继续获得客户的支持与信任!原理:原生js的indexOf() 方法,该方法将从头到尾地检索数组,看它是否含有对应的元素。开始检索的位置在数组 start 处或数组的开头(没有指定 start 参数时)。如果找到一个 item,则返回 item 的第一次出现的位置。开始位置的索引为 0。
如果在数组中没找到指定元素则返回 -1。
下面先看示例:
搜索前:
搜索后:
实现方法:
methods:{ // 点击搜索工程 search(){ // 支持模糊查询 // this.xmgcqkJsonsData:用于搜索的总数据 // toLowerCase():用于把字符串转为小写,让模糊查询更加清晰 let _search = this.jobNo.toLowerCase(); let newListData = []; // 用于存放搜索出来数据的新数组 if (_search) { this.xmgcqkJsonsData.filter(item => { if (item.code.toLowerCase().indexOf(_search) !== -1) { newListData.push(item); } }) } this.xmgcqkJsonsData = newListData; // console.log(‘新数组',newListData) }, }
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流