useState direktivi nə üçün istifadə olunur?

useState — React hook-dur və funksional komponentlərə vəziyyət əlavə etməyə imkan verir. O, iki elementli massiv qaytarır: cari vəziyyət dəyəri və onu yeniləmək üçün funksiya. Yeniləmə funksiyası çağırıldıqda, komponent yeni dəyərlə yenidən render olunur.

İstifadə nümunəsi:

import { useState } from 'react';

function Counter() {
  // 'count' hazırkı vəziyyət, 'setCount' onun yenilənməsi üçün funksiyadır
  const [count, setCount] = useState(0);

  return (
    <div>
      <p>Sayaç: {count}</p>
      <button onClick={() => setCount(count + 1)}>
        Artır
      </button>
    </div>
  );
}

Əsas xüsusiyyətlər:

• Vəziyyət əlavə edir: Bu, funksional komponentlərdə vəziyyət istifadə etməyə imkan verir, əvvəlcə yalnız siniflərdə mövcud idi.
• Yeniləmə funksiyası: Vəziyyəti dəyişdirmək üçün xüsusi funksiya qaytarır.
• Yenidən render: Vəziyyəti yeniləmə funksiyası vasitəsilə dəyişdirmək, komponentin yenidən render olunmasına səbəb olur.
• Primitivlər və obyektlər: Hər hansı məlumat növünü saxlaya bilər: ədədlər, sətirlər, booleanlar, obyektlər, massivlər.
• Lazımi şəkildə ilkinləşdirmə: Başlanğıc dəyər yalnız ilk renderdə işləyən funksiya ola bilər, bu da bahalı hesablamalar üçün faydalıdır.

const [data, setData] = useState(() => {
  // Bahalı hesablamalar yalnız bir dəfə yerinə yetirilir
  const initialData = someExpensiveCalculation();
  return initialData;
});