反応の入力の onChange イベントは、handleOnchange メソッドにバインドされています。このメソッドが呼び出された後、ajax 呼び出しは遅延します。ユーザーが「王の栄光」と入力すると、入力速度の問題により、「王」に対する 2 つのリクエストが発生します。栄光の」、「王の栄光」が最終的に送られる可能性があります。 。
現時点では、最初の「King of Glory」リクエストは、2 番目の「King of Glory」リクエストよりも返されるまでに時間がかかります。最終的に表示される結果では、ユーザーには入力ボックスが「King of Glory」であることがわかりますが、結果は「キング・オブ・グローリー」「結果は網羅されています。
この状況を回避する技術的な解決策はありますか?
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
1. 同期 ajax (エスケープ) を使用します。
リーリー2. バックグラウンドによって返される結果には、要求されたキーワードが含まれており、それを現在の入力値と比較します。
3. 自動インクリメント ID をグローバルに維持し、それを各リクエストに追加します。リクエストによって返されたフィールドにこの ID を返します。返された ID が現在のページの ID と一致する場合はそのデータを使用し、それ以外の場合は破棄します
要約すると、ページに複数のフォーム クエリ条件がある場合は、オプション 3 が最も多用途です。オプション 2 は非常に困難です。