score:1

Accepted answer
constructor() {
  this.state = {
    // Your initial state
    loading: true,
  }
}

componentDidMount() {
  fetch("https://pokeapi.co/api/v2/pokemon/")
    .then(resp => resp.json())
    .then(items => {
      const pokemon = [];
      const url = [];
      items.results.forEach(item => {
        pokemon.push(item.name);
        url.push(item.url);
      });
      this.setState({ pokemon, url, loading: false });
     });
}

render (){
  if (loading) {
    return <Loader />;
  }
  return (
    <div>
      <Fetchpokemon data={this.state}/>
    </div>
  );
}

score:0

this.setState(items.results.reduce((newState, item) => {
    return {
        pokemon: [...newState.pokemon, item.name],
        url: [...newState.url, item.url]
    }
}, this.state))

score:0

constructor(props) {
    this.state = {
        pokemon: [],
        url: []
    }
}

componentDidMount() {
    fetch("https://pokeapi.co/api/v2/pokemon/")
    .then(resp => resp.json())
    .then(items =>{
        //console.log(items.results);
        const names = [], urls = [];
        items.results.forEach(item => {
            names.push(item.name)
            urls.push(item.url)
        });
        this.setState({
            pokemon: [...this.state.pokemon, ...names],
            url: [...this.state.url, ...urls]
        });
    });
}

render () {
    return (
        <div>
            {
                this.state.pokemon.length !== 0 && <Fetchpokemon data={this.state}/>
            }
        </div>
    )
}

Related Query

More Query from same tag