反応ループデータの実装（リスト）

   './image/bg3.png' から bg3 をインポートします。
   コンストラクタ(props){
      スーパー(小道具)
      この状態 = {
      ///ここにリスト:[
            { id:1,img:bg3},
            { id:2,img:bg3},
            { id:3,img:bg3},
            { id:4,img:bg3},
            { id:5,img:bg3},
         ]、 
     ///     
      }
   }

  {
        this.state.list.map((item,key) => {
            戻る （
              <div className="winfor" onClick={() => console.log(item.id)}>
                 <img src={item.img} className="winforimg" />
                    
                 
              </div>
            ）
          })
  }

React をインポートし、{Component} を 'react' から取得します。
'./logo.svg' からロゴをインポートします。
'./App.css' をインポートします。
'./Person/Person' から {Person,Twoway} をインポートします。
 
クラスAppはComponentを拡張します{
  状態={
    人物:[{name:'リトルフェアリー',年齢:'18'},{name:'シャオユウ',年齢:'18'},{name:'ジアシュアン',年齢:'18'}],
 
  }
 
  与える（）{
    const listItems = this.state.persons.map((item,index) =>
       <人物名={item.name} 年齢={item.age} キー={index} />
     );
      戻る（
        <div className="アプリ">
             {リスト項目}
        </div>
      ）      
  } 
} 
デフォルトのアプリをエクスポートします。