Visión general

Estoy tratando de pasar un objeto de datos que contiene cadenas y objetos a mi componente

El problema

Cuando reviso la documentación de Next.js para pasar accesorios, trato de enviarlo en el formato de par de valores clave. Cuando trato de usar cualquiera de mis accesorios en mi componente, no están definidos. ¿Estoy desestructurando mal?

mis intentos

Esto es con lo que estoy trabajando actualmente. Busco algunos datos, obtengo el primer objeto en una matriz de objetos y desestructurar solo las claves que quiero. Luego puse las llaves de un objeto del park .

 export async function getStaticProps({params}) { const URL = 'https://developer.nps.gov/api/v1/' // Call API Data for /PARK const res = await fetch( `${URL}parks?parkCode=${params?.parkCode}&limit=465&api_key=${process.env.API_KEY}`, { method: 'GET', headers: { Accept: 'application/json, text/plain, */*', 'User-Agent': '*', }, } ) const parkData = await res.json() if (!parkData) { return {notFound: true} } const park = parkData?.data[0] // The park object looks like this: { name: 'A name', fullName: 'John Doe', parkCode: 'abcd', description: 'lorem ipsum', designation: 'park', imags: [ { url: 'http://...', title: 'img1', }, { url: 'http://...', title: 'img1', }, ], } const {name, description, parkCode, designation, images, fullName} = park return { props: { park: {name, fullName, description, parkCode, designation, images}, }, revalidate: 1, } }

En mi componente, así es como trato de consumirlo, pero obtengo errores indefinidos.

 export default function Park({park}) { console.log(park) // undefined }