في التفاعل، العنصر هو أصغر وحدة بناء، ويمكن تعريف الكائن، وليس عنصر DOM، في التعليمات البرمجية باستخدام jsx، وبناء الجملة هو "عنصر ثابت =..."؛ لا يمكن تغيير العنصر بعد إنشائه تريد تغيير DOM، يمكنك فقط إنشاء عنصر جديد.
بيئة تشغيل هذا البرنامج التعليمي: نظام Windows 10، إصدار التفاعل 17.0.1، كمبيوتر Dell G3.
عنصر
1. العنصر هو أصغر وحدة بناء في التفاعل، وهو كائن وليس DOM، وتكلفة إنشائه منخفضة نسبيًا.
(1) عادةً ما نستخدم JSX لتحديد عنصر في الكود:
عنصر ثابت = <h1>مرحبًا بالعالم</h1>;(2) استخدم ReactDOM.render للعرض
ReactDOM.render( element, document.getElementById('root') );2. بمجرد إنشاء عنصر، لا يمكن تغييره، فهو يشبه إطارًا في فيلم إذا كنت تريد تغيير عرض DOM، فيمكنك فقط إنشاء عنصر جديد.
3. ستقوم React بمقارنة العنصرين قبل وبعد، وتحديث المحتوى الذي يحتاج إلى التحديث فقط.
قم بتوسيع معرفتك:
دوم افتراضي
1. لا تقوم React ببناء عناصر DOM مباشرةً، ولكنها تنشئ كائنات مشابهة لبنية DOM. ثم يتم تقديم DOM الحقيقي بناءً على هذه البنية، وهي React DOM.
2. عندما يكون هناك تغيير، قم بإنشاء كائن جديد، وقارنه بالبنية السابقة، وسجل الفرق بين الاثنين. يمكنك إلقاء نظرة على خوارزمية الفرق هنا.
3. يتم بعد ذلك تحديث DOM بناءً على الاختلافات المسجلة.
ReactElement
1. "DOM" الافتراضي؛
2. الجوهر هو كائن غير قابل للتغيير.
سمة النوع: إذا كانت سلسلة مثل 'h1'، فهي تمثل عقدة DOM، وسمة الدعائم الخاصة بها مخصصة لسمات عقدة DOM
وظيفة أو فئة، فهو يمثل مكونا؛
3. يمكن دمج نوعي ReactElement في بعضهما البعض وخلطهما مع بعضهما البعض لوصف شجرة DOM؛