مُنشئات الخصائص ومختزل الحالة (مبسط)
وفّر معالجات آمنة باستخدام مُنشئات الخصائص، واسمح للمكوّنات الأب بتعديل الانتقالات عبر مختزل حالة مبسط.
مُنشئات الخصائص ومختزل الحالة (مبسط) درس مجاني في React Academy على CoddyKit. هذا هو الدرس 2 من أصل 2. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في React Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة React Academy 2 دروس في المجموع.
لماذا نستخدم getters وreducer
الهدف: جعل المكوّنات مرنة من دون تعقيد.
- Prop getters: تُعيد خصائص آمنة (المعالجات وARIA والفئات) لنشرها
- State reducer: يتيح للعنصر الأب تعديل الانتقالات
- قطع صغيرة مناسبة للمبتدئين
Getters: تركيب آمن
- وفّر getButtonProps(userProps)
- ادمج المعالجات باستخدام مساعد صغير هو callAll
- أضف ARIA والحالة بأمان، مثل aria-pressed
عرض توضيحي: Prop getters
يعيد Prop getter خصائص مدمجة، بحيث يستطيع العنصر الأب تمرير معالجات إضافية من دون كسر المعالجات الداخلية.
<div id="root"></div>
عرض توضيحي: تخصيص reducer
تتيح خاصية reducer للعناصر الأب تعديل الانتقالات. هنا نمنع التبديل إلى off بعد تشغيله.
<div id="root"></div>
عرض توضيحي: دمج خصائص المستخدم
يمكن للعناصر الأب تمرير خصائص إضافية (مثل التحليلات والعناوين) مع دمجها بأمان باستخدام getter.
<div id="root"></div>
نصائح ومطبات شائعة
- اجعل getters صغيرة؛ وأضف القيم الافتراضية الآمنة فقط، مثل aria-pressed
- ينبغي أن يعيد reducer قيمة state (دالة نقية)
- لا تستدعِ معالجات المستخدم مرتين؛ استخدم callAll صغيرًا
اختبار نمط reducer
مراجعة سريعة
مراجعة سريعة: تدمج Prop getters المعالجات والخصائص بأمان، ويتيح state reducer خفيف للعناصر الأب تعديل الانتقالات مع بقاء المكوّن بسيطًا.
الأسئلة الشائعة
هل درس «مُنشئات الخصائص ومختزل الحالة (مبسط)» مجاني؟
نعم — نص درس «مُنشئات الخصائص ومختزل الحالة (مبسط)» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة React Academy، انتقل إلى CoddyKit PRO. تتضمن دورة React Academy 2 دروس في المجموع.
ماذا ستتعلم في «مُنشئات الخصائص ومختزل الحالة (مبسط)»؟
وفّر معالجات آمنة باستخدام مُنشئات الخصائص، واسمح للمكوّنات الأب بتعديل الانتقالات عبر مختزل حالة مبسط. تتمرن على React Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.
هل أحتاج إلى خبرة سابقة لأبدأ React Academy؟
لا تُشترط خبرة سابقة. React Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 2 من أصل 2.
كم من الوقت يستغرق درس «مُنشئات الخصائص ومختزل الحالة (مبسط)»؟
معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.
هل يمكنني كتابة وتشغيل أكواد في درس React Academy هذا؟
نعم. كل درس في React Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.
جميع الدروس في هذه الدورة
- المفاضلات وأنماط المراجع والقيم الافتراضية
- مُنشئات الخصائص ومختزل الحالة (مبسط)