Tengo un problema al obtener datos de mi API y mostrarlos en una página web. Recibo este error: "items.map no es una función". No estoy seguro de si esto es un problema con este código o tal vez mi código para mi solicitud de obtención en la API, publicaré ambos códigos por si acaso.
Pegaré mi código a continuación sin el enlace a mi API. Gracias,
import React from "react"; class App extends React.Component { constructor(props) { super(props); this.state = { items: [], isLoaded: false } } componentDidMount() { fetch(" api link ") .then(res => res.json()) .then(json => { this.setState({ isLoaded: true, items: json }); }).catch((err) => { console.log(err); }); } render() { const { isLoaded, items } = this.state; if (!isLoaded) return <div>Loading...</div>; return ( <div className="App"> <ul> {items.map(item => ( <li key={item.oid}> Name: {item.rows.productName} | Condition: {item.rows.productCondition} </li> ))} </ul> </div> ); } } export default App;codigo API:
async function getComments(req) { let status = 500, data = null; try { const sql = 'SELECT * FROM products'; const rows = await db.query(sql); if (rows) { status = 200; data = { rows, }; } else { status = 204; } } catch (e) { console.error(e); } return { status, data }; } app.get('/demo/api_project', async (req, res) => { const { status, data } = await getComments(req); res.status(status); if (data) res.json(data); else res.end(); })intente console.log() su respuesta de la API, puede encontrar que su matriz está anidada dentro del objeto de respuesta.