JSX'te veri listesi görüntülemek için ne kullanılır?

JSX'te veri listesini göstermek için JavaScript dizilerinin .map() yöntemi kullanılır.

// Veri dizisi örneği
const items = ['Madde 1', 'Madde 2', 'Madde 3'];

// Listeyi .map() ile gösterme
const List = () => (
  <ul>
    {items.map((item, index) => (
      // Her liste öğesi için benzersiz bir anahtar kullanmak zorunludur
      <li key={index}>{item}</li>
    ))}
  </ul>
);

map() her dizideki öğeyi dolaşır ve yeni bir React öğeleri dizisi döndürür, bu da DOM'da render edilir. Listenin her öğesi için benzersiz bir key özelliği kullanmak önemlidir. Bu, React'in liste değiştiğinde kullanıcı arayüzünü verimli bir şekilde güncellemesine yardımcı olur. key olarak, verilerin benzersiz bir tanımlayıcısı kullanılabilir veya yoksa dizideki öğenin indeksi kullanılabilir.