الدرس 7 من 8
إلغاء الطلب القديم
- 15 دقيقة
- 4 فحوص
- 3 تلميحات
- إلى المطلوب
هدف الدرس
تظهر نتائج آخر بحث فقط
الشرح
في البحث الفوري يُرسل كل حرف تكتبه طلبًا جديدًا، ولا شيء يضمن أن تصل الردود بالترتيب نفسه، فقد يصل ردّ «ق» البطيء بعد ردّ «قلم» فيكتب فوقه، ويرى المستخدم نتائج كلمة لم يعد يبحث عنها.
أمّا AbortController فيلغي الطلب نفسه وليس انتظارك له فقط، إذ تمرّر signal إلى fetch، وحين تستدعي abort() يُرفض الطلب بخطأ اسمه AbortError، فألغِ الطلب السابق قبل كل طلب جديد.
والإلغاء قرار اتّخذته أنت وليس فشلًا، فلا تعرضه على المستخدم كأنه خطأ، بل تجاهل AbortError وحده واترك الأخطاء الأخرى تظهر. ولاحظ أن المتحكّم (controller) لا يُستعمل إلا مرّة واحدة، فأنشئ متحكّمًا جديدًا لكل طلب.
المطلوب
كلّما كتب المستخدم في #q ألغِ الطلب السابق، ومرّر signal الخاصّ بالطلب الجديد إلى api، وتجاهل AbortError، حتى لا يظهر في #out إلا ردّ آخر بحث.
الفحوص
4 فحوص- البحث الواحد يصل كالمعتاد
- الردّ القديم لا يكتب فوق الأحدث
- الطلب السابق يُلغى فعلًا ولا يُتجاهل فقط
- الإلغاء لا يظهر للمستخدم كأنه خطأ