開發中遇到需要對大量數據實時搜索，頻繁調取api產生的問題記錄
1、每輸入一個字符，就向后端發一次請求。當輸入完一個人名的時候，就已經向后端發送了好多條請求，太多的請求會給服務器帶來壓力，其實在實時搜索過程中也並不需要發太多請求；
2、由於這些請求都是異步的，雖然發送請求時有先后順序，但是返回的結果並不會按照發送請求那樣有個先后順序，而是哪個先匹配出結果哪個就先返回，后返回來的結果會將先返回來的結果覆蓋，這樣導致在最后輸入完之后，發現下面展示的並不是最終的搜索結果。例如當輸完“libai”時，下方展示的內容並不是“libai”對應的內容，而是“li”對應的內容。
解決方法：
1、減少請求次數
將發送請求的命令放入到定時器setTimeout中，然后通過定時器來限制向后端發送請求的次數。例如：規定在輸入完一個字符后，如果300ms內沒有繼續輸入，那么300ms后就發送一次請求；如果在300ms內繼續輸入了內容，那么就會刪除上次定時器，重新開始計時，直到300ms內沒有繼續輸入時再發送請求。這樣就減少了一些不必要的請求
實例：
searchVague(val) {
if (this.timer) {
clearTimeout(this.timer);
}
if (val) {
this.timer = setTimeout(() => {
this.getData(val);
}, 300);
} else {
// 輸入框中的內容被刪為空時觸發，此時會清除之前展示的搜索結果
}
}
2.請求順序返回保證結果匹配
從上面已知請求是異步的，發送請求時是按照先后順序的，返回的結果的順序則是難以預料的，導致出現最終想要的搜索結果被之前的請求返回結果覆蓋。為了解決上述問題，我們需要讓返回的結果也有個先后順序，即先請求的先返回，如果在發送下一次請求時，上一次請求還沒結束，那么就取消上一次的發送請求。查了一下，應該和防止重復提交請求：可以采用請求隊列的方式，每次請求時檢查隊列中有無該請求，有則返回，無則提交，並將該請求添加到隊列，響應完畢，將響應的請求從隊列中移除。api的防重放機制有關系，后續了解。