import React, { useState, useEffect, } from "react"; function ProductDetail({match}) { useEffect(() => { fetchItem(); // console.log(match) }, ); const fetchItem = async () => { const fetchItem = await fetch(`https://fortnite-api.theapinetwork.com/item/get?id={{itemid}}`); const item = await fetchItem.json(); console.log(item); } return ( <div className="containter productsDetails"> <h1>Product Detail</h1> </div> ); } export default ProductDetail;ingrese la descripción de la imagen aquí
import React, { useState, useEffect } from "react"; import {Link} from "react-router-dom"; function Products() { const [data, setData] = useState([]); const apiGet = () => { fetch(`https://fortnite-api.theapinetwork.com/items/popular`) .then((response) => response.json()) .then((json) => { console.log(json); setData(json); }); }; useEffect(() => { apiGet(); },[]) return ( <div> <div> <ul> {data.map(item => <li key={item.id}> <Link to={`/products/${item.id}`}>{item.item}</Link> </li> )} </ul> </div> </div> ); } export default Products;He intentado todas las formas que puedo encontrar en línea.
No puedo mapear en el objeto de entradas de esta API. Me gustaría asignar a los 3 objetos de matriz.
Para que pueda {coincidir} usando una ID cuando hago clic en uno de ellos.
El enrutamiento está funcionando. Pero no puedo mostrar ninguno de los datos en la pantalla. En la consola se muestra.
El es la API fortnite-api.theapinetwork.com/items/popular
Está tratando de usar la función de mapa en el objeto. map solo funciona para arreglos.
Aquí está el enlace a sandbox cómo debería ser