الدرس 6 من 8
الحالة المشتقّة
- 13 دقيقة
- 5 معايير للتصحيح
- 3 تلميحات
- إلى المطلوب
هدف الدرس
احسب ولا تخزّن
01
الشرح
بعض القيم ليست حالة بل نتيجة لها: عدد القطع ومجموع السلّة يُحسبان من العناصر. فإن خزّنتهما في state بجوار العناصر صار عندك مصدران للحقيقة، وعليك أن تحدّث الاثنين في كل مكان يتغيّر فيه أيّهما.
ولن تتذكّر دائمًا. في الكود أدناه تحدّث الإضافةُ المجموعَ وينساه الحذف، فتعرض السلّة رقمًا خاطئًا — وهذا من أكثر أعطال الواجهات شيوعًا وأصعبها تتبّعًا.
القاعدة: خزّن الحدّ الأدنى، واشتقّ الباقي عند الرسم. reduce على عشرات العناصر أرخص بكثير من خطأ تزامن واحد.
02
المطلوب
احذف count وtotal من state ومن المستمعين، واحسبهما داخل render() من state.items: العدد مجموع الكمّيات qty، والمجموع مجموع price × qty.
معايير التصحيح
5 معايير- الحالة لا تخزّن ما يُحسب منها
- العدد مجموع الكمّيات، والمجموع صحيح
- الإضافة تُبقي الرقمين صحيحين
- الحذف يُبقي الرقمين صحيحين
- أي تغيير في العناصر يظهر في الرسم التالي