Estoy usando React y Contentful para crear una aplicación, esto usa GraphQL para la consulta de datos y estoy tratando de recuperar una matriz en una página de estilo 'post' creada por el slug. Puedo extraer datos estáticos, pero necesito poder mostrar contenido de un par de matrices diferentes, pero veo que me encuentro con un problema de enrutamiento o análisis.
He creado la consulta GraphQL a continuación:
export const pageQuery = graphql` query CareerPageQuery($slug: String!) { contentfulSite(id: { eq: "c898f54a-af7b-5e84-acd2-4a5ff6b0d086" }) { siteTitle } contentfulCareer(slug: { eq: $slug }) { title slug description thePerson { info { info } } theJob { info { info } } theExperience { info { info } } theRewards { info { info } } progression { progression } toApply { toApply } }} `
Luego creo las variables para poder acceder a datos estáticos como el título y la descripción:
const career = get(this.props, 'data.contentfulCareer') Esto me permite agarrar el título como {career.title} pero cuando trato de mapear a través de una matriz, arroja un error.
ERROR #85911 GRAPHQL There was a problem parsing "website-name/src/templates/career.js"; any GraphQL fragments or queries in this file were not processed. This may indicate a syntax error in the code, or it may be a file type that Gatsby does not know how to parse.Estoy mapeando a través de la matriz de la siguiente manera:
{career.thePerson.map((value) => ( {value.info.info} ))}Parece que no puedo identificar el error de sintaxis o si hay un error general que no veo. ¡Lo más probable es que me esté perdiendo algo!
Hay un mensaje de error adicional que dice esto:
ERROR #98123 WEBPACK Generating development JavaScript bundle failed website-name/src/templates/career.js: Unexpected token, expected "," (128:20) 126 | <CareerTitle>The Role:</CareerTitle> 127 | {career.thePerson.map((value) => ( > 128 | {value.info.info} | ^ 129 | ))} 130 | <CareerTitle>Responsibilities:</CareerTitle> 131 | {/*<CareerText dangerouslySetInnerHTML={{ __html: career.responsibilities.responsibilities}} />*/} File: src/templates/career.js:128:20Tiene un error de sintaxis en la devolución de su mapa. En lugar de encerrarlo entre corchetes, haga algo como esto.
{career.thePerson.map((value) => value.info.info )}