State: Bir Bileşenin Hafızası

Bileşenler, etkileşimin bir sonucu olarak ekranda olanı değiştirmeye sıklıkla ihtiyaç duyarlar. Forma yazı yazmak, giriş alanını güncellemelidir, resim karuselinde “sonraki”ye tıklamak gösterilen resmi değiştirmelidir, “satın al” düğmesine tıklamak bir ürünü alışveriş sepetine koymalıdır. Bileşenler şeyleri “hatırlamalıdır”: mevcut girdi değeri, mevcut resim, alışveriş sepeti. React’te, bileşene özgü bu tür bellek state olarak adlandırılır.

Bunları öğreneceksiniz

  • useState Hook’u ile state değişkeni nasıl eklenir
  • useState Hook’unun döndürdüğü değer çifti
  • Birden fazla state değişkeni nasıl eklenir
  • Neden state’in yerel olarak adlandırıldığı

Normal bir değişken yeterli olmadığında

İşte bir heykel resmini oluşturan bir bileşen. “Sonraki” düğmesine tıklanarak index değişkeni 1, ardından 2 ve benzeri şekilde değiştirilerek bir sonraki heykel gösterilmelidir. Ancak bu çalışmayacaktır (deneyebilirsiniz!):