javascript 反应地图

Posted 2021-05-03

import React, { Component } from 'react'
const arr = [12,23,56]
class DisplayPokemon extends Component {
    state = {
    data:[]
  }

    //!Lance la function au demarrage
 componentDidMount() {
   this.fetchData()
 }

//Récupere data
  fetchData = async () => {
    const data = await fetch("https://raw.githubusercontent.com/Biuni/PokemonGO-Pokedex/master/pokedex.json")
    const json = await data.json();
   this.setState({data:json.pokemon})
  }
    render () {
            return (
                <div>
                   {
                      this.state.data.map((x) => {
                           return (
                                <div>
                                <ul>
                                    <img src={x.img} alt="#" srcset=""/>
                                    <li>{x.name}</li>
                               </ul>

                               <button>Click</button>


                                </div>

                           )
                       })
                   }
                </div>

            )
    }



}

export default DisplayPokemon