Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- import React, { useEffect, useState } from "react";
- const getEvolutionChain = (chain) => {
- const evolutionChain = [];
- const getNextChain = (pokemon) => {
- evolutionChain.push(pokemon.species.name);
- if (pokemon.evolves_to.length) {
- getNextChain(pokemon.evolves_to[0]);
- }
- };
- getNextChain(chain);
- return evolutionChain;
- };
- export default function List() {
- const [pokemon, setPokemon] = useState([]);
- const [isLoading, setIsLoading] = useState(false);
- const [isError, setIsError] = useState(false);
- useEffect(async () => {
- const url = "https://pokeapi.co/api/v2/evolution-chain/1/";
- try {
- setIsLoading(true);
- const repsonse = await fetch(url);
- const pokemonData = await repsonse.json();
- const evolutionChain = getEvolutionChain(pokemonData.chain);
- setPokemon(evolutionChain);
- } catch (e) {
- console.log(e);
- setIsError(e.message);
- } finally {
- setIsLoading(false);
- }
- }, [setIsError, setIsLoading, setPokemon]);
- return isError ? (
- <>{isError}</>
- ) : isLoading ? (
- <>Loading...</>
- ) : (
- <ul>
- {pokemon.map((text) => (
- <li>{text}</li>
- ))}
- </ul>
- );
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement