Kas tiek izmantojams datu saraksta attēlošanai JSX?

Lai JSX parādītu datu sarakstu, tiek izmanto JavaScript masīvu .map() metodi.

// Datu masīva piemērs
const items = ['Punkts 1', 'Punkts 2', 'Punkts 3'];

// Saraksta parādīšana ar `.map()`
const List = () => (
  <ul>
    {items.map((item, index) => (
      // Katram saraksta elementam ir jālieto unikāls atslēgas atribūts
      <li key={index}>{item}</li>
    ))}
  </ul>
);

map() pārbauda katru elementu masīvā un atgriež jaunu React elementu masīvu, kas pēc tam tiek attēlots DOM. Ir svarīgi katram saraksta elementam izmantot unikālu key īpašību. Tas palīdz React efektīvi atjaunināt lietotāja saskarni, kad saraksts mainās. Kā key var izmantot unikālu datu identifikatoru vai, ja tāda nav, elementa indeksu masīvā.