美文网首页
输入框输入搜索节流函数

输入框输入搜索节流函数

作者: 舒塔先生 | 来源:发表于2022-11-01 11:40 被阅读0次

我们做输入搜索的时候并不希望看到每输入一个拼音就向服务器发送一次请求,这样会对服务器造成一定的压力,这里跟大家分享一个自己写的节流函数,每输入停止两秒后触发一次请求,两秒内再次输入重置两秒计时

    inputValueChange (query) {
        //输入搜索节流函数
        //query输入的字符串
        this.realTimeInputValue = strRep(query)


        this.time = setTimeout(() => {

          if (query == this.realTimeInputValue ) {
            //停止输入2秒后执行搜索
       
            this.markSure(); // 调用写好的方法

          }
        }, 2000)
      },
      markSure () {
       ///你自己的接口请求
        postRequest('/*******', {
       
        }).then(res => {

 
        })
        ///你自己的接口请求
      },

相关文章

  • 函数节流与函数防抖

    函数节流 适用场景:按钮防重复点击 函数防抖 适用场景:input输入框搜索

  • 输入框输入搜索节流函数

    我们做输入搜索的时候并不希望看到每输入一个拼音就向服务器发送一次请求,这样会对服务器造成一定的压力,这里跟大家分享...

  • vue中实现防抖和节流

    防抖函数的使用场景: 频繁触发、输入框搜索 节流函数的使用场景:频繁触发、onrize,onscroll滚动条

  • 节流函数的应用场景

    vue实现输入框的模糊查询(节流函数的应用场景) 上一篇讲到了javascript的节流函数和防抖函数,那么我们在...

  • 前端的面试题(下)

    7、手写函数防抖和函数节流 函数节流 函数节流是让这个函数在间隔某一段时间执行一次以输入框为例,假设你想查询xxx...

  • 关于输入框的细节

    1、输入框类型:包括信息输入框、注册、登录输入框、搜索输入框、原创输入框、对话输入框以及其它; 2、文本输入框使用...

  • 几个关于输入框的细节

    输入框的类型包括信息输入框、注册、登录输入框、搜索输入框、原创输入框、对话输入框等。文本输入框使用场景多,交互频次...

  • Tailwind Component

    按钮(button) 带符号的按钮 输入框(input) 普通输入框 邮箱输入框 文本域(textarea) 搜索...

  • web测试方法

    Web测试方法总结 一、输入框 1 1、字符型输入框:2 2、数值型输入框:2 3、日期型输入框:2 二、搜索功能...

  • Vue 实例学习: 搜索页面实例

    搜索页面 在输入框输入搜索内容,列表显示配置的列表:

网友评论

      本文标题:输入框输入搜索节流函数

      本文链接:https://www.haomeiwen.com/subject/kkprtdtx.html