تابستون داره تموم میشه ها، فرصت‌ها محدودن کلی آفر جذاب در کمپین تابستون🔥👇
۰ ثانیه
۰ دقیقه
۰ ساعت
۳ سیروان صادقی
نحوه رندر کامپوننت
جامعه ری اکت ایجاد شده در ۰۴ اردیبهشت ۱۴۰۱

با عرض سلام و خسته نباشید.

من یه سوالی داشتم در مورد نحوه رندر کامپوننت. توی کد این جلسه وقتی قبل ازدستور return کامپوننت، لاگ می‌کنیم یک پیغامی رو، این پیغام، توی حالتی که درون متد کلیک از setTimeout استفاده شده، دو بار در خروجی چاپ میشه در حالی که لاگ درون تابع useEffect یکبار چاپ میشه (با چند بار کلیک پشت سر هم) و وقتی که درون تابع کلیک مستقیما بصورت سینک مقدار count تغییر می‌کنه، با هر بار کلیک، یکبار لاگ درون بدنه اصلی تابع و یکبار لاگ داخل useEffect چاپ میشه (به تعداد مساوی)، علت چیه؟ مگر نه اینکه رندر شدن دوباره کامپوننت همان اجرای تابع کامپوننت است!!!

7d47-1.png

f2d6-2.png

سلام

در صورتی که state hook با مقدار فعلی state که دارد update شود react بدون رندر مجدد کامپوننت‌ها فرزند و همچنین بدون اجرا کردن effects کار رو پیش میبره در واقع چون که مقدار تکراری هست و باعث تغییر در خروجی نمی‌شود چیزی در DOM تغییر نمی‌کند

ولی همچنان در بعضی از موارد react نیاز داره که اون کامپوننتی که state اون فراخوانش شده دوباره همون کامپوننت رو render بکن ولی چون که تفاوتی با render قبلی ندارد پس در نتیجه DOM رو تغییر نمیده و effects رو هم فراخوانی نمیکن

این موردی هم که شما اشاره کردید یکی از مواردی هست که این مورد اتفاق می‌افته


اگر نیاز به توضیح بیشتر داری لطفا بگید کدوم بخشش رو ابهام دارید که بیشتر توضیح بدم

مجتبی سوری ۰۵ اردیبهشت ۱۴۰۱، ۰۵:۵۴

(ولی همچنان در بعضی از موارد react نیاز داره که اون کامپوننتی که state اون فراخوانش شده دوباره همون کامپوننت رو render بکن ولی چون که تفاوتی با render قبلی ندارد پس در نتیجه DOM رو تغییر نمیده و effects رو هم فراخوانی نمیکن این موردی هم که شما اشاره کردید یکی از مواردی هست که این مورد اتفاق می‌افته) این مورد طبق چه قانون و روالی اتفاق میوفته یکم عجیبه برام. وقتی که مثلا بالای 3 بار مثلا 6، 7 بار روی دکمه کلیک میشه فقط یک بار اضافه چاپ میشه و نه هر 6 7 بار . بقیه حالات همه مثل هم هستند . از کلیک 2 به بعد همه یک رفتار دارند یعنی همه همون state رو دوباره set می‌کنند و ریاکت همه رو تشخیص میده و useEffect رو اجرا نمیکنه این سیاست چرا برای بدنه خود تابع وجود نداره چرا اولین setState با مقدار تغییر نیافته همراه با اجرای بدنه است ولی بقیه جلوشون گرفته میشه؟

سیروان صادقی ۰۵ اردیبهشت ۱۴۰۱، ۰۷:۱۷