Implementierung von React-Loop-Daten (Liste)

   importiere bg3 aus „./image/bg3.png“
   Konstruktor (Requisiten) {
      super(Requisiten)
      dieser.Zustand = {
      ///Hier Liste:[
            { id:1,img:bg3},
            { id:2,img:bg3},
            { id:3,img:bg3},
            { id:4,img:bg3},
            { id:5,img:bg3},
         ], 
     ///     
      }
   }

  {
        dieser.Status.Liste.Map((Element,Schlüssel) => {
            zurückkehren (
              <div Klassenname = "winfor" onClick = {() => console.log(item.id)}>
                 <img src={item.img} Klassenname="winforimg" />
                    
                 
              </div>
            )
          })
  }

importiere React, {Component} von „react“;
Logo aus „./logo.svg“ importieren;
importiere './App.css';
importiere {Person,Twoway} aus './Person/Person'
 
Klasse App erweitert Komponente {
  Zustand={
    Personen: [{Name: 'Kleine Fee', Alter: '18'}, {Name: 'Xiaoyu', Alter: '18'}, {Name: 'Jiaxuan', Alter: '18'}],
 
  }
 
  machen(){
    const listItems = dieser.Zustand.Personen.Map((Item,Index) =>
       <Personenname={item.name} Alter={item.age} Schlüssel={index} />
     );
      zurückkehren(
        <div Klassenname="App">
             {Listenelemente}
        </div>
      )      
  } 
} 
Standard-App exportieren;