React bileşenlerinde bir dizi içinde eşleme yapmak, verilerin görüntülenmesi için bir döngü kullanmanızı gerektirir. Bunu yapmak için map() fonksiyonunu kullanabilirsiniz. Aşağıdaki örnekte, bir dizi içindeki her bir elemanı React componentleri olarak görüntülemek için map() kullanılır:
import React from 'react'; class ExampleComponent extends React.Component { render() { const data = [1, 2, 3, 4, 5]; return ( <div> {data.map((item, index) => ( <p key={index}>{item}</p> ))} </div> ); } } export default ExampleComponent;
Dizi elemanlarının görüntülenmesi için map() fonksiyonu, dizi elemanlarından bir öğe üretir ve bu öğeleri bir dizi olarak döndürür. React bileşeni tarafından bu dizi, render() metodunda HTML elementleri olarak görüntülenir. Ayrıca, her bir dizi elemanı için bir anahtar belirtmeniz gerekir, böylece React, dizi elemanlarının hangi sıradaki olduğunu tanımlayabilir ve performansı artırabilir.