الدرس 7 من 8

إلغاء الطلب القديم

هدف الدرس

آخر بحث هو ما يُعرض

01

الشرح

في البحث الفوري يُطلق كل حرف طلبًا، ولا شيء يضمن أن الردود تصل بترتيبها. ردّ «ق» البطيء قد يصل بعد ردّ «قلم» فيكتب فوقه، فيرى المستخدم نتائج كلمة لم يعد يبحث عنها.

AbortController يلغي الطلب نفسه لا انتظارك له فقط: تمرّر signal إلى fetch، وحين تستدعي abort() يُرفض الطلب بخطأ اسمه AbortError. فقبل كل طلب جديد ألغِ السابق.

والإلغاء قرارك لا فشل، فلا تعرضه على المستخدم خطأً: تجاهل AbortError وحده ودع غيره يظهر. والمتحكّم يُستعمل مرّة واحدة، فلكل طلب متحكّم جديد.

02

المطلوب

مع كل كتابة في #q ألغِ الطلب السابق، ومرّر signal الطلب الجديد إلى api، وتجاهل AbortError، حتى لا يظهر في #out إلا ردّ آخر بحث.

معايير التصحيح

4 معايير
  1. بحث واحد يصل كالمعتاد
  2. الردّ القديم لا يكتب فوق الأحدث
  3. الطلب السابق يُلغى فعلًا لا يُتجاهل فقط
  4. الإلغاء لا يظهر للمستخدم خطأً
index.html
المعاينة
index.html100%
–/4

اضغط «تشغيل» ليبدأ الفحص.

4 معايير في بطاقة «المطلوب».