0

Estoy consultando una api que me devuelve

introducir la descripción de la imagen aquí

y estoy renderizando los primeros datos de esta manera

{!season[0]?.episodeOrder ? 'No episodes' : <p>Episodes: {season[0].episodeOrder}</p>}
{!season[0]?.summary ? 'No summary' : <p>{season[0].summary}</p>}

Lo que pretendo es hacer esto para todo el array, intente utilizar un map, pero no funciono. Agradecería que me dieran ideas de cómo puedo lograr esto.

1
  • Dejame ver si entendi, lo que quieres hacer es mapear cada valor del arreglo en una etiqueta P diferente ? De modo que cada valor del arreglo quede <p>season[0].episodeOrder</p> <p>season[1].episodeOrder</p> <p>season[2].episodeOrder</p> asi sucesivamente?
    – itsMarck
    Commented el 28 jul. 2022 a las 3:10

1 respuesta 1

0

No estoy seguro si lo que quieres es iterar todos los elementos y mostrarlos en una lista o algo parecido, de momento te dejo este pequeño ejemplo de como los puedes iterar con map, si no es lo que estas buscando házmelo saber, para que modifique la respuesta.

//Declaramos un state
const [datos, setDatos] = useState([])

Esta parte seria tu fetch donde haces la llamada y supongo que igual estarías renderizando con useEffect en caso de que no esa parte te tocaría a ti agregarla.

 fetch("https://api.example.com/items")
      .then(res => res.json())
      .then(
        (result) => {
          setItems(result);
         })

ahora en el return harias lo siguiente, con map llamas al estado que guardo los datos de la api y solo mandas a llamar cada uno de los datos que quieres mostrar

return(
    <ul>
    {datos.map(item => (
      <li key={item.id}>
        {item.episodeOrder} {item.summary}
      </li>
    ))}
  </ul>
  )

con esto te dara la lista de todos los valores de la llamada que estas realizando.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.