utilizo usseEffect y hago dos llamadas de api seguidas, se agrega correctamente al stade, pero al hacer un render map no aparece nada, la sensación es como que hace render aparece y desaparece al momento.

De pronto hay una mejor forma llamar a la api y me haga render, agradezco la ayuda.

si hago una sola llamada al api, me funciona bien rederizando el nombre,  al llamar a la primera api "const response = await axios.get(`https://pokeapi.co/api/v2/pokemon?offset=${numero}&limit=4`);" si me renderiza el la propiedad name, pero como necesito más datos, utilizo el nombre para completar el otro llamado de api y me trae muchos mas datos.

Meti todo a un state y aparece bien en componentes pero al hacer map para renderizar  no me aparece.


 ```

import React, { useState, useEffect } from 'react'
import axios from 'axios';



export default function Pokedex() {

   

    //useState
    const [pokemonData, setPokemoData] = useState<any>([]);

   

    useEffect(() => {

        const getPokemonDinamic = async (numero?: string) => { //llamar los primeros pokemon

            const response = await axios.get(`https://pokeapi.co/api/v2/pokemon?offset=${numero}&limit=4`);

            const data: any = await response.data;

            const arra: any = data.results.map((x: any) => x.name)


            let array: any = [];
            arra.map(async (x: any) => {


                const response: any = await axios.get(`https://pokeapi.co/api/v2/pokemon/${x}`)
                const data: any = await response.data



                let obj: any = {
                    name: data.name,
                    img: `https://play.pokemonshowdown.com/sprites/xyani/${data.name}.gif`,
                    tipos: data.types.map((type: any) => { return type.type.name }),
                    hp: data.stats[0].base_stat,
                    attack: data.stats[1].base_stat,
                    defense: data.stats[2].base_stat,
                    speed: data.stats[5].base_stat,
                    id: data.id,
                }
                array.push(obj)


            })
            setPokemoData(array)

        }

        getPokemonDinamic("0")


    }, [])

    return (
        <div>
            {
                pokemonData.length > 0 && pokemonData.map((x: any) => {
                    return (

                        <h1>{x.name}</h1>
                    )
                })
            }
        </div>

    )
}

 ```