首页 > 其他分享 >前端实现模糊搜索

前端实现模糊搜索

时间:2022-10-10 11:55:25浏览次数:45  
标签:keyword text 前端 模糊 list 搜索 newList let reg

onSearchChange() {
      if(this.keyword){
          let text = this.keyword
          let reg = new RegExp(text) 
          //利用正则规则获取符合搜索条件的数据
          let list = this.newList.filter(item => reg.test(item.name)) 
          //获取符合条件的数据
          this.list=list
        }else{
        	//keyword为空,则恢复全部数据显示
          this.list = this.newList
        }
    },

 

标签:keyword,text,前端,模糊,list,搜索,newList,let,reg
From: https://www.cnblogs.com/Privatexaio/p/16775149.html

相关文章

  • 前端
    JS闭包闭包的应用:实现数据的私有内存泄漏内存泄漏指任何对象在您不再拥有或需要它之后仍然存在闭包=内层函数+引用的外层函数变量constouter=()=>{......
  • vue前端
       代码//在body标签中<divid="app">{{message}}</div>varapp=newVue({el:'#app',data:{message:'HelloVue!'}}) ......
  • #yyds干货盘点#前端架构API层的封装
    上午好,今天为大家分享下个人对于前端​​API​​​层架构的一点经验和看法。架构设计是一条永远走不完的路,没有最好,只有更好。这个道理适用于软件设计的各个场景,前端​​API......
  • ABAP 增加搜索帮助
    (一).在表维护生成器增加搜索帮助效果:方法:步骤一:SE11->表->菜单->实用程序->表格维护生成器双击概述屏幕的屏幕号,进入屏幕逻辑流,增加代码如下    "增加f4  PR......
  • JS模块化—CJS&AMD&CMD&ES6-前端面试知识点查漏补缺
    本文从以时间为轴从以下几个方面进行总结JS模块化。从无模块化=>IIFE=>CJS=>AMD=>CMD=>ES6=>webpack这几个阶段进行分析。历史幼年期:无模块化方式需要......
  • 【前端必会】适合首页的滚动过渡(CSS transition)
    背景经常看到一些首页的过渡效果不错,闲来无事,实现个基本效果直接上代码<body><divid="1"class="blockbuild-in-scale-up"><h1>Hello1</h1></div><divid="2"c......
  • 【yishaadmin】yisha前端优化(持续更新)
    1、单页面字典调用问题处理yisha-data.js中修改,注意如果想要无权限也可以查看界面,当前请求接口权限标识去除,注意也把字典信息查询接口权限标识去除。functiongetDat......
  • Date前端日期变为年龄处理方法
    现在页面展示效果为: 1,首先编写一个过滤器用来处理想要处理的数据 2,将要处理的数据绑定到过滤器上3,过滤器中:输入该代码即可完成效果(重点)filters:{showAge(value){......
  • 前端使用json-server快速搭建服务
    一、json-server概述​ 一个在前端本地运行,可以存储json数据的server。​ 通俗来说,就是模拟服务端接口数据,一般用在前后端分离后,前端人员可以不依赖API开发,而在本地搭建......
  • #yyds干货盘点# 前端歌谣的刷题之路-第一百零九题-双向数据绑定
    前言我是歌谣我有个兄弟巅峰的时候排名c站总榜19叫前端小歌谣曾经我花了三年的时间创作了他现在我要用五年的时间超越他今天又是接近兄弟的一天人生难免坎坷大不了从......