State یک شی در جاوا اسکریپت است که داده های پویا ی کامپوننت ها را در خود نگه می‌دارد. و امکان ردیابی بین رندر ها را امکان‌پذیر میکند. از آنجا که حالت پویا است، تنها امکان تعامل پذیری را ممکن می‌سازد. به همین دلیل در پروژه های ایستا کاربردی ندارد.
کامپوننت ها به صورت کلاس هایی هستند که ویژگی های اضافی دارند و state محلی به معنای یک ویژگی هستند که کلاس ها موجود اند. استیت ها تنها در کلاس ها می‌توانند مورد استفاده قرار گیرند. و معمولا تنها جایی که میتوان آن را به عنوان سازنده اعلام کرد this.state است.
مدیریت state درون کامپوننت صورت می‌گیرد. State در کامپوننت react همانند متغیر درون یک تابع است. State ها در کامپوننت react حالت محلی خودش است یعنی در خارج از کامپوننت مورد دسترسی و یا تغییر قرار می‌گیرد و تنها درون آن کامپوننت هاکاربرد دارد. این همانند تابعی است که حیطه محلی خود را دارد.
نقش setstate() چیست ؟
در واقع ()setState وظیفه زمان بندی برای بروزرسانی شی کامپوننت است. زمانی که یک state تغییر کند، کامپوننت از طریق رندرگیری مجددا جوابی ارسال میکند.
نحوه استفاده صحیح از State ها
- State را به صورت مستقیم تغییر ندهید.
- بروزرسانی در State ها ناهنگام است.
- به روزرسانی های State ادغام می‌شود.
حال به بررسی هر کدام میپردازیم تا بهتر مفهوم آن را درک کنیم.
State را به صورت مستقیم تغییر ندهید.
می‌گوییم نباید به صورت مستقیم تغییر دهیم، زیرا باعث می‌شود که کامپوننت به صورت خودکار مجددا رندرگیری نشود. تنها جایی که میتوان this.state را به آن داد در constructor است.
بروزرسانی نابهنگام state ها
React می‌تواند چندین فراخوانی را به منظور عملکرد با هم در یک بروزرسانی تجمیع کند. به همین دلیل setstate را فراخوانی می کنند. فراخوانی setstate زمانی که درون event handlers قرار دارند، ناهمگامند. در این حالا ما از this.state برای نشان دادن مقدار جدید بلافاصله پس از فراخوانی setstate استفاده نمی‌کنیم. برای اصلاح این وضعیت باید از شکل دیگری از تابع setstate استفاده کنیم. که به جای یک شی یک تابع را می پذیرد. تا از فراخوانی جدید ترین نسخه state مطمئن شوید.
بروزرسانی حالت ادغام
زمانی که setstate را فراخوانی میکنیم، در واقع یک شی را که به حالت جاری ارسال کرده ادغام میکنیم. برای مثال میتوانیم برای هر state چندین متغیر جداگانه تعریف کنیم. به همین دلیل میتوان state ها را به صورت جدا از هم با فراخوانی‌های متفاوت ()setSatet به‌روزرسانی کرد.
گردش رو به پایین داده ها
کامپوننت های پدر و کامپوننت های فرزند به هیچ عنوان نمی توانند بدانند که که یک کامپوننت stateless یا stateful است . و اهمیتی هم نمی دهد که کامپوننت به صورت تابع و یا کلاس تعریف شده باشد. در حالت کلی میتوان گفت اطلاعات فقط در دسترس کامپوننتی است که مالک باشد. به همین دلیل است که state در اغلب موارد، محلی یا کپسوله گفته می‌شود. و اطلاعات فقط از سطح بالا به پایین قابل دسترسی اند.
دیدگاهتان را بنویسید