鍍金池/ 問答/HTML5  HTML/ vue做一個搜索,每次按下鍵盤都會請求一次?

vue做一個搜索,每次按下鍵盤都會請求一次?

clipboard.png

一個類似微信的搜索,沒有“搜索”按鈕,就一個input框。

<input @keyup="load_list($event)">

現在一個問題:
輸入“ABCD”
向后臺發(fā)送了4次請求
A一次
B一次
C一次
D一次

于是我加了定時器,1秒后發(fā)送請求:
輸入“ABCD”
向后臺發(fā)送了4次請求
ABCD一次
ABCD一次
ABCD一次
ABCD一次

我要瘋了,有好的解決方法么?

回答
編輯回答
替身

你需要防抖(debounce)函數

2017年9月4日 09:42
編輯回答
安于心

寫定時器是完全可以實現的 每次輸入的時候都要先清除定時器 然后再新開一個定時器 什么時候時間到了 什么時候才會觸發(fā)。example:

全局:let timer = null;
method:{
    load_list(){
        clearInterval(timer);
        timer = setInterval(()=>{
            Ajax();
        }, 1000)
    }
}

try one try.

2018年5月28日 06:09
編輯回答
夏木

函數去抖 https://www.lodashjs.com/docs... 了解一下

2018年7月2日 04:17
編輯回答
萢萢糖

比較簡單穩(wěn)定的方法:引入 lodash。
如果想控制輸入后函數執(zhí)行的頻率,使用 lodash 中的 debounce 模塊。
參考鏈接

2017年1月6日 15:33
編輯回答
尕筱澄

用@input事件即可。改動最小

2017年1月9日 20:34
編輯回答
柒喵

跟vue沒關系,你用的keyup事件,就是每次按鍵了抬起就觸發(fā)一次,你可以寫個定時器,沒問題,但是要用setinterval,var aa = setinterval(); 設置一個輸入時限,入過在時限內,就clearInterval(aa),然后再加setinterval.

2018年3月25日 14:08
編輯回答
歆久

輸入之后設置個定時器來控制請求,如果又監(jiān)聽到鍵盤的輸入操作,取消定時器,如果沒有就請求

2018年4月6日 14:57
編輯回答
夏夕

那就在后面加一個確定按鈕,或者監(jiān)聽回車鍵,再搜索

2018年2月19日 03:34
編輯回答
瘋浪
  • 推薦@input事件
  • 首先你要搞清楚你搜索的規(guī)則(字符串length..)達到這個規(guī)則再進行請求
2017年3月15日 13:12