import React from 'react'
import { useEffect, useState } from 'react'
function PokemonCard() {
useEffect(() => {
fetch('https://pokeapi.co/api/v2/pokemon/charizard')
.then(res => res.json())
.then(setPokemon)
},[])
const [pokemon, setPokemon] = useState([])
console.log(pokemon)
return (
<div>
<h1>{pokemon.name}</h1>
<img alt='yo' src={pokemon.sprites.front_default}></img>
<h2>Type: {pokemon.types[0].type.name}</h2>
<h2>Height: {pokemon.height}</h2>
<h2>Weight: {pokemon.weight}</h2>
</div>
)
}
export default PokemonCard;
the code works in the initial load but after i refresh i get an error dont understand why its comes back as an empty array in the beginning