useState

سلام خدمت شما. فکر کنم برای سوال اول منظورتون setState بوده. من ترجیح میدم از روش اول استفاده کنم که خود React هم همینو توصیه کرده که برای استفاده از مقدار قبلی از prev استفاده کنیم.

سوال 2 :

ما توی React بحثی به نام ref داریم که برای دسترسی به DOM استفاده میشه ازش حالا وقتی بخوایم این ref رو لایه های پایین Component ها ارسال کنیم از forwradRef استفاده می کنیم. مثلا یک Component فرزند میخواد به ref والد دسترسی داشته باشه. useMemo برای memoziation استفاده میشه و معنیش این هست که اگر محاسبه یک مقداری وابسته به ورودی ها اون هست تا زمانی که ورودی ها تغییر نکردن دوباره اون محاسبه انجام نشه. مثلا تا props ورودی Component تغییری نکنه ما محاسبه رو دوباره اجرا نکنیم و این باعث بهینه سازی میشه.

من توی یه کامپوننتم از datepicker استفاده کردم و اومدم یه customInput براش نوشتم از هیچ ref ای هم استفاده نکردم تو کنسول به من گیر میده که باید واسه کامپونتت customInput بیای از forwardref استفاده کنی

واسه زمانی که context میدیم به یه کامپوننت هم useMemo به درد میخوره من تو یه کامپوننت دیدم اومده بود پارامترهای context  توی useMemo گذاشته بود و راستش خیلی درک نکردم چه بهینگی واسش ایجاد میکنه اینکه گفتم این دوتا رو توضیح بدید دلیلش همین بود چون توی عمل واقعا جایی که مثلا سنیور شرکت ما داره استفاده میکنه من اگه میزدم استفاده نمیکردم 

معمولا توی Component های آماده که این مساله رعایت نمیشه این هشدار رو نشون میده و شما هم نمی تونید کاری کنید چون دست شما نیست. باید سورس کدهای اون Component اماده تغییر کنه.

توی بحث Context هم چون بر اساس تغییر داده های ورودی Context رندر دوباره در تمامی Consumer ها اتفاق میفته استفاده از useMemo می تونه بهینه سازی و جلوگیری از رندر دوباره بشه.

به کامپوننت آماده گیر نمیده به کد من گیر میده که اضافه کردم تا ظاهر اینپوت datepicker عوض کنم

const CustomInput = React.forwardRef((props, ref) => (
  <div
    className="input-datepicker"
    onClick={props.onClick}
  >
    {props.value}
    <i className="fa fa-calendar-alt float-right"></i>
  </div>
))

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

const CustomInput = React.forwardRef((props, ref) => (
  <div
    className="input-datepicker"
    onClick={props.onClick}
    ref={ref} // HERE
  >
    {props.value}
    <i className="fa fa-calendar-alt float-right"></i>
  </div>
))

اگه React.forwardRef نزارم تو کنسول به من ارور میده که این اضافه کنم مشکل من همینه که من نمیخوام از ref استفاده کنم چرا همچین گیری میده و من همینجور الکی اول کامپوننتم گذاشتمش اگه براش دارم این خطا رو میده و این نشون میده من هنوز نمیدونم کجا باید این forwardref بزارم :)

webpack-internal:///./node_modules/react-dom/cjs/react-dom.development.js:88 Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?

Check the render method of `o`.
    in CustomInput (at SetupDate.js:243)

اگر دقت کنید خطای شما داره از فایل setupDate.js میاد و این قطعا برای کتاب خونه ای هست که استفاده کردید. اگر اون Component ای که از کتابخونه میاد نیاز به استفاده از ref داشته باشه و شما اون رو داخل یک Component دیگه wrap کرده باشید شما باید forwardRef رو براش استفاده کنید