تفاوت کامپوننت های Controlled با Uncontrolled

امید کیانی 205 بازدید 1398/07/15
تفاوت کامپوننت های Controlled با Uncontrolled

کامپوننت های کنترل شده (Controlled Component)

یک کامپوننت کنترل شده به یک مقدار محدود می شود و تغییرات آن به صورت فراخوانی های مبتنی بر رویداد انجام می گیرد.

در کامپوننت های کنترل شده،عناصر ورودی فرم به جای DOM توسط کامپوننت ری اکت کنترل می شوند.در اینجا حالت های قابل تغییر در state property نگه داشته شده و  تنها با متد ()setState بروزرسانی می شوند.

کامپوننت های کنترل شده دارای توابعی هستند که داده های موجود در آنها را با رویداد onChange کنترل می کنند.این داده ها در state ذخیره شده و با متد ()setState بروزرسانی می شوند.این امر باعث می شود تا کامپوننت کنترل بهتری بر عناصر فرم و داده ها داشته باشد.

کامپوننت های کنترل نشده (Uncontrolled Component)

ورودی های کنترل نشده شبیه به ورودی های فرم در html سنتی است که DOM داده های فرم را کنترل می کند.

عناصر html وضعیت خود را حفظ می کنند و با تغییر مقدار ورودی به روز می شوند.برای نوشتن یک کامپوننت uncontrolled،ما به یک مرجع برای گرفتن مقادیر فرم از DOM نیاز داریم،به عبارت دیگر نیازی نیست برای تغییر هر حالت یک event handler تعریف کنیم.ما از یک مرجع برای دسترسی به مقدار فیلد ورودی فرم از DOM استفاده می کنیم.

تفاوت های Controlled Component و Uncontrolled Component

کامپوننت کنترل شده:

۱-وضعیت درونی خود را حفظ نمی کند.

۲-داده ها توسط کامپوننت والد کنترل می شوند.

۳-مقدار فعلی خود را به عنوان prop می پذیرد.

۴-اجازه می دهد تا داده های خود را اعتبارسنجی کنید.

۵-کنترل بهتری بر روی عناصر فرم و داده ها دارد.

 

کامپوننت کنترل نشده:

۱-وضعیت درونی خود را حفظ می کند.

۲-داده ها توسط خود DOM کنترل می شوند.

۳-از یک مرجع برای مقادیر فعلی خود استفاده می کند.

۴-اجازه نمی دهد تا داده های خود را اعتبارسنجی کنید.

۵-کنترل محدودی بر روی عناصر فرم و داده ها دارد.

دیگر مقالات
حمید تیموری 1279 بازدید 1397/05/14
امید کیانی 458 بازدید 1398/07/17
امید کیانی 396 بازدید 1398/07/14
امید کیانی 363 بازدید 1398/05/14
حمید تیموری 171 بازدید 1399/02/12


نظرات (0)
هنوز نظری ثبت نشده است
برای ثبت نظر ابتدا وارد سایت شوید