Tengo la siguiente página index.js, que usa un componente de diseño:
import Layout from "../components/layout"; export default function Home({posts}) { console.log(posts) return ( <Layout posts={posts}> <div className="showmore" data-total="total"> test </div> </Layout> ) } export async function getServerSideProps() { const res = await fetch('http://gsr2.localhost.xip.io/api/news') const posts = await res.json() return { props: { posts, }, } }¿Cómo obtengo las publicaciones en el diseño para usarlas en otro componente allí?
Este es mi diseño, pero solo obtengo a los children y nada más.
export default function Layout({children, props}) { console.log(children, props); return ( <> <Head/> <main>{children}</main> <News>{props}</News <Footer/> </> ) }Hay un malentendido aquí, cuando intenta acceder a elementos secundarios y accesorios en su diseño, está tratando de obtener accesorios de propiedad que habrían pasado al componente.
En su lugar, deberías hacer
({ niños, publicaciones })
Allí debería poder acceder a las publicaciones.