Tengo lo siguiente donde puedo imprimir los data provenientes de getServerSideProps . Pero cuando lo paso a la sección de componentes, las posts de valor de utilería no están definidas. ¿Por qué?
Lo siguiente está en /pages y está dentro del archivo base index.tsx.
import type { NextPage } from 'next' import Post from '../components/Post' const Home: NextPage = ({ posts }) => { // This prints undefined. This is the issue. console.log(posts) return ( <div> <Post posts={posts}/> </div> ) } export default Home export const getServerSideProps = async () => { const response = await fetch('http://localhost:8080/posts/all') const data = await response.json() // this prints correctly console.log(data) return { props: { posts: data } } };Actualizaciones para mostrar el archivo _app.tsx
import Home from '../pages'; const TestApp = () => { return <> <Home /> </> } export default TestAppElimine el archivo _app.tsx personalizado o actualícelo para que acepte una propiedad de Component y reprodúzcalo como se muestra en la documentación de Nextjs para una App personalizada .
El problema es que esta App personalizada siempre representa el componente Home (sin accesorios), por lo que se imprime undefined . Luego, intente navegar hacia / en localhost . Debería representar el archivo index.tsx e invocar correctamente getServerSideProps y pasar el resultado al componente como espera.