Rumah > hujung hadapan web > tutorial js > Asas React~fungsi peta/ senarai data~

Asas React~fungsi peta/ senarai data~

Susan Sarandon
Lepaskan: 2024-10-07 18:17:02
asal
334 orang telah melayarinya
  • Apabila kami mahu memaparkan senarai data, bagaimanakah kami melakukannya?

・src/Example.js


const animals = ["Dog", "Cat", "Rat"];

const Example = () => {
  return (
    <>
      <ul>
        {/* Not using the map function. */}
        <li>{animals[0]}</li>
        <li>{animals[1]}</li>
        <li>{animals[2]}</li>
      </ul>
    </>
  );
};

export default Example;


Salin selepas log masuk
  • Kod ini memaparkan senarai data dengan betul.

・src/Example.js


const animals = ["Dog", "Cat", "Rat"];

const Example = () => {
  return (
    <>
      <ul>
        {/* Using the map function. */}
        {animals.map((animal) => (
          <li> {animal}</li>
        ))}
      </ul>
    </>
  );
};

export default Example;


Salin selepas log masuk
  • Apabila kita ingin memaparkan senarai data, fungsi Peta sering digunakan untuk memaparkan tatasusunan data seperti

  • elemen.

  • Sila jangan lupa untuk meletakkan atribut utama pada

  • elemen.

  • Kod ini lebih bersih daripada yang sebelumnya.

・Ini ialah amaran konsol, sekiranya kami tidak meletakkan atribut utama pada

  • elemen.

    React Basics~map function/ a list of data~

    ・Ini adalah hasil pada skrin.

    React Basics~map function/ a list of data~

    Atas ialah kandungan terperinci Asas React~fungsi peta/ senarai data~. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

    Kenyataan Laman Web ini
    Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
    Artikel terbaru oleh pengarang
    Tutorial Popular
    Lagi>
    Muat turun terkini
    Lagi>
    kesan web
    Kod sumber laman web
    Bahan laman web
    Templat hujung hadapan