Si quiero devolver una matriz de objetos de una matriz anidada en JS/React, ¿cuál sería la forma de hacerlo? Intenté lo siguiente, pero esto da un error sobre los niños reactivos: los objetos no se pueden representar cuando los niños prueban una matriz.
datos:
{ "title": 0, "name": 0, "score": 0, "summary": [ { "id": 1, "start": "2019-11-01", "end": "2019-11-04" }, { "id": 2, "start": "2019-11-01", "end": "2019-11-04" } ] }Yo he tratado:
const newArray = result?.summary?.map((inner: any) => { return ( { from: new Date(inner?.start), to: new Date(inner?.end), label: { text: (inner?.id), }, } ) }) ¿Quiero crear una nueva matriz de objetos con los datos de la matriz anidada de summary ?
¿algunas ideas?
Este es el problema. Necesita convertir sus dates en strings . El paquete de terceros que ingresa en esta matriz intenta representar los objetos Date y no lo hace. La fecha es object type y de eso se trata el error.
Prueba esto:
const newArray = result?.summary?.map((inner: any) => { return ( { from: new Date(inner?.start).toString(), to: new Date(inner?.end).toString(), label: { text: (inner?.id), }, } ) }) Use toDateString para obtener una cadena de fecha formateada.
Tengo un problema diferente, pero con datos similares. Estoy tratando de crear un componente React que itera a través de una colección y devuelve datos seleccionados desde dentro de cada documento, usando la función render(). Para los datos anteriores, la parte de obtención de datos de mi código dentro de render() se vería así:
{this.state.buttonClicked ? this.state.data.map(data => { return ( <React.Fragment> <tr> <td style={{align: "left", width: "10%"}} >{data.title}</td> <td style={{align: "left", width: "10%"}} >{data.name}</td> <td>{data.score}</td> <td>{data.summary.start}</td> <td>{data.summary.end}</td> </tr> </React.Fragment> ); }) : null} He intentado poner índices de matriz en la expresión, por ejemplo, data.summary[1].start , pero haga lo que haga, los datos dentro de la matriz no aparecen.