Render List dengan map & Key

Daftar data dirender menggunakan array.map(). Setiap elemen list WAJIB diberi prop key unik untuk efisiensi perbandingan Virtual DOM.

👀 Contoh dulu

const item = ["Apel", "Jeruk"];
return (
  <ul>
    {item.map((b, i) => (
      <li key={i}>{b}</li>
    ))}
  </ul>
);

Hasilnya: Daftar ul berisi li Apel dan Jeruk

💡 Prop key membantu React menentukan elemen mana yang berubah saat re-render.

📝 Sekarang giliranmu

Buat komponen function Menu() dengan const hobi = ['Koding', 'Membaca'] lalu render list <ul> menggunakan map() dengan prop key.

Preview