obteniendo error (No se pueden leer las propiedades de undefined (leyendo 'mapa')) mientras se representa la lista. el código se adjunta a continuación por favor ayuda. REACT Código en el que se han obtenido y probado los datos.
import React, { Component } from 'react' // import axios from 'axios'; export default class List extends Component { constructor(props) { super(props); this.state={apiResponse:[]}; } callAPI() { fetch("http://localhost:9000/testAPI") .then( (res) => res.json()) .then( (data) => {this.setState({apiResponse: data.task});}); } componentWillMount() { this.callAPI(); } render() { return ( <div> <h1>{this.state.apiResponse}</h1> { this.state.apiResponse.map((r)=> <li >r.task</li> ) } </div> ) } }NODE JS desde donde se obtienen los datos para reaccionar
router.get("/",function(req,res) { MongoClient.connect(url, function(err, db) { if (err) throw err; var dbo = db.db("to-do"); // var query = { address: "Park Lane 38" }; dbo.collection("to-do").find({}).toArray(function(err, result) { if (err) throw err; console.log(result); res.json(result) // res.send((result)) db.close(); }); }); })Su problema es que su respuesta json no incluye la propiedad de la tarea (al menos no siempre). Al establecer apiResponse en este valor, lo está configurando como indefinido y la función de mapa ya no está disponible. Una solución podría ser verificar si la tarea de propiedad está disponible antes de establecer el estado.
fetch("http://localhost:9000/testAPI") .then( (res) => res.json()) .then( (data) => { if (data.task) { this.setState({apiResponse: data.task}); } });