Asas React~fungsi peta/ senarai data~

• 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;

• 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;

• 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

・Ini adalah hasil pada skrin.

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