سؤال بخصوص history.push

فكرة history.push في رياكت هي ببساطة التوجيه من الصفحة الحالية إلى الصفحة المعطاة بإستخدام react-router، فهي تستقبل كمعامل أول الوجهة المستهدفة.

ونستعملها ضمن سياق props وكتابع لها لأنه يتم تصريحها ضمنه -ضمن خواص المكون-، ولذلك فإن history هو كائن يتواجد كخاصية ضمن props في حين أن push هي تابع لهذا الكائن. هاته هي الفكرة ببساطة. 

props.history.push('/destination-page')

بتاريخ منذ ساعة مضت قال Adnane Kadri:

فكرة history.push في رياكت هي ببساطة التوجيه من الصفحة الحالية إلى الصفحة المعطاة بإستخدام react-router، فهي تستقبل كمعامل أول الوجهة المستهدفة.

ونستعملها ضمن سياق props وكتابع لها لأنه يتم تصريحها ضمنه -ضمن خواص المكون-، ولذلك فإن history هو كائن يتواجد كخاصية ضمن props في حين أن push هي تابع لهذا الكائن. هاته هي الفكرة ببساطة. 

props.history.push('/destination-page')

 

ماذا عن التكرار الكثير جددددددا في الاكواد مثل props.user 

وداله اخرى نفس الشى لماذا تم وضغ props  و من ثم في كل مره ومسميات تلخبط ؟

بتاريخ 1 ساعة قال Bandar Abuseada:

ماذا عن التكرار الكثير جددددددا في الاكواد مثل props.user 

وداله اخرى نفس الشى لماذا تم وضغ props  و من ثم في كل مره ومسميات تلخبط ؟

تذكر أن props ما هو إلا كائن خواص نسنده إلى مكون رياكت، فأي خاص تتعلق بالمكون الأب والأبناء نضعها فيها. من بينها user أو المستخدم الحالي. مثل هاته الأمور التي نتوقع تكرارها في كثير من أجزاء التطبيق، فنقوم بضبطها كخاصية يسهل الوصول إليها في أي جزء من المكونات.

 البرمجة هي مجال واسع و يستغرق الوقت والممارسة لفهم جميع المفاهيم والمصطلحات.  من الأفضل أن تتعلم الأساسيات ببطء وتركز على فهم المفاهيم الأساسية قبل التحرك إلى الأمور المتقدمة.بحيث المفاهيم التي تحتاج لتوضيح أكثر قم بطرح سؤال أسفل الدرس الخاص بها وسيتم التوضيح بشكل أكبر 

وكما أخبرك عدنان في التعليق السابق فإن history هو كائن يتم استخدامه للتحكم في تاريخ المتصفح (history)، أي سجل الصفحات التي تمت زيارتها. يوفر العديد من الوظائف مثل push() التي تستخدم لتغيير عنوان URL وتوجيه المستخدم إلى صفحة جديدة. عند استخدام props.history.push('/')، يتم توجيه المستخدم إلى الصفحة الرئيسية ("/").

وبالنسبة للأكواد الأخرى

if (!contact.name.includes(this.state.search)) return:

هذا الشرط يتحقق إذا كان اسم جهة الاتصال (contact.name) لا يحتوي على النص الموجود في حقل البحث (this.state.search). إذا كان الشرط صحيحًا (الاسم لا يحتوي على النص المطلوب)، فسيتم إيقاف تنفيذ الدالة وعدم عرض جهة الاتصال.

let messages = this.props.messages.filter(e => e.sender === contact._id || e.receiver === contact._id);

هنا يتم تصفية الرسائل (messages) بناءً على جهة الاتصال المحددة (contact._id). يتم استخدام دالة filter() لاسترجاع الرسائل التي تم إرسالها من قبل جهة الاتصال أو استلامها منه. تُحفظ الرسائل المصفاة في المتغير messages.

let lastMessage = messages[messages.length-1];

هذا الكود يستخرج آخر رسالة تمت مراسلتها بين المستخدم وجهة الاتصال المحددة. يتم حفظ الرسالة الأخيرة في المتغير lastMessage بناءً على طول قائمة الرسائل (messages) واستخلاص العنصر الأخير منها (messages.length-1).

let unseen = messages.filter(e => !e.seen && e.sender === contact._id).length:

هذا الكود يستخرج عدد الرسائل غير المرئية (التي لم يتم رؤيتها) بين المستخدم وجهة الاتصال المحددة. يتم تصفية الرسائل (messages) لاسترداد تلك التي لم يتم رؤيتها (!e.seen)، والتي تمت إرسالها من قبل جهة الاتصال (e.sender === contact._id)، ومن ثم يتم حساب عددها بواسطة .length. يتم حفظ العدد في المتغير unseen.