ماذا يعني رد فعل المكون غير المنضبط؟

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

بيئة تشغيل هذا البرنامج التعليمي: نظام Windows 10، إصدار التفاعل 17.0.1، كمبيوتر Dell G3.

ماذا يعني رد فعل المكون غير المنضبط؟

ما هو المكون غير المنضبط؟

نبدأ بكلمتين، أي أن المكون المتحكم فيه وغير المتحكم به هو مفاهيم من وجهة نظر المكونات، والمعنى الحرفي هو أن المكونات لا يتم التحكم فيها، ولا يتحكم فيها أحد، بالطبع ليس من خلال المكون الأصلي، فما هي خصائص المكونات غير المنضبطة، أي أن كل المنطق يرتبط فقط بنفسه وليس له اتصال أو تقاطع مع المكونات الأخرى.

في HTML، تشكل عناصر مثل و و وتحافظ على حالتها الخاصة ويتم تحديثها بناءً على إدخال المستخدم. لكن في React، هذه المكونات كلها عبارة عن مكونات غير قابلة للتحكم بدون معالجة، لأنه عندما تستخدمها فعليًا، ستجد أن هذه المكونات لن تقوم بتحديث القيمة تلقائيًا، فالقيمة التي ندخلها دون أي معالجة غير قادرة على الحصول على القيمة المدخلة باستخدام

مثال

استيراد React, { Component } من 'react';استيراد ReactDOM من 'react-dom';class Demo1 يمتد Component { render() { return ( <input /> //<ABC /> ) }}ReactDOM.render(<Demo1 />، document.getElementById('content'))

شرح المكونات غير المنضبطة

نظرًا لأن المكون غير المنضبط هو مكون ليس له تقاطع مع العالم الخارجي، فلا يمكننا بعد الآن استخدام المكونات غير المنضبطة.

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

عند تطوير الصفحات الثابتة، لا نستخدم عادةً أطر العمل ونستخدم لغة HTML فقط لكتابة ملفات منفصلة، ​​ولكن إذا كانت صفحة معينة في مشروعنا عبارة عن صفحة ثابتة، فهل سنستخدمها؟ الصفحات التي تعرضها مكوناتنا غير الخاضعة للرقابة لا تحتوي على تغليف ولا يمكن أن تكون سوى صفحات مخصصة عندما تكون مكونات صفحتنا موجودة بمفردها، فهي مكونات غير خاضعة للتحكم.

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

قم بتوسيع معرفتك:

ما هو العنصر الخاضع للرقابة؟

وهذا هو عكس المكون غير المتحكم فيه ويعني حرفيًا المكون الذي يتم التحكم فيه بواسطة المكون الأصلي.

يتم بالطبع التحكم في كيفية تحكم المكون الأصلي في المكون الفرعي عن طريق تمرير القيم عندما يتم استخدام قيمة الدعائم بواسطة المكون الفرعي، ويتم تغيير المحتوى أو الطريقة أو نتيجة العرض للمكون الفرعي بسبب القيمة التي تم تمريرها بواسطة المكون الأصلي. ، المكون الفرعي عبارة عن مكونات يتم التحكم فيها بواسطة المكونات الأصلية

مثال

import React,{Component} from 'react';import ReactDOM من 'react-dom'; =>{ Let val = events.target.value; this.setState({val}) } render(){ return ( <div> <p>{this.state.val}</p> //<input type= "text" value='123' /> <input type="text" value={this.state.val} onChange={this.handleChange} /> // الإدخال هو مكون يتم التحكم فيه بواسطة خصائص كائن الحالة </ div> ) }}ReactDOM.render(<Input/>,window.app)

لا ينبغي لنا أن نعتبر المدخلات بمثابة مكون إدخال، بل يجب أن نعتبر المدخلات بمثابة أي مكون نشير إليه أو نغلفه بأنفسنا بعد أن نقوم بتمرير قيمة لهذا المكون، حتى لو كان سلسلة ثابتة تم تمريرها بواسطتنا، فإنه لا يزال في الأساس مثل مكونات الإدخال التي يتم التحكم فيها، لا تنظر المكونات التي يتم التحكم فيها إلى ما إذا كان هناك ربط ثنائي الاتجاه للبيانات، ولكن ما إذا كان يتم التحكم فيها بطبيعتها. عندما نمرر قيمة ثابتة، تكون قيمة مكون الإدخال ثابتة ولا يمكن ذلك يمكن تعديلها، على الرغم من أن تمرير الدعائم هي قيمة مشفرة، إلا أن هذه القيمة لا تزال تتحكم في مكون الإدخال.

شرح المكونات الخاضعة للرقابة

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

على سبيل المثال، رمز مكون inpu أعلاه يعادل منطقة النص ويحدد المكونات. نحتاج جميعًا إلى تمرير بعض المعلمات (الدعائم) لإبلاغ قواعد العرض المحددة وعرض محتوى المكون. على سبيل المثال، تعد سمة النوع أيضًا طريقة بالنسبة لنا للسيطرة على المكون.

ربط البيانات في اتجاهين: في الواقع، عندما نقوم بتمرير أي قيمة أو سمة إلى قيمة، يتم تغيير معنى المكون إلى مكون متحكم فيه، ولكن عندما نربط onChange، يتم تغيير البيانات إلى المكون الخاص بنا من خلال onChange. في طريقة رد الاتصال، نقوم بتغيير البيانات من خلال setState لإعادة العرض. هذا هو ربط البيانات ثنائي الاتجاه الذي يحرك العرض، ويحرك العرض البيانات.

ملخص: المكونات الخاضعة للرقابة والمكونات غير الخاضعة للرقابة هي مفهوم يشير إلى ما إذا كان المكون الحالي متحكمًا وما إذا كان مكونًا منفصلاً لا يتفاعل مع المحتوى الآخر. ببساطة، يمكن اعتبار المكون المستقل تمامًا مكونًا غير متحكم فيه، كل شيء آخر يتم التحكم في المكونات