getStaticProps/getServerSideProps는 페이지 구성 요소에 연결할 수 없습니다.
페이지 구성 요소 중 하나 getStaticProps에 getStaticPaths, 또는 getServerSideProps별도의 내보내기 대신 구성원으로 첨부했습니다.
이러한 메소드는 동일한 방식으로 첨부할 수 없으며 getInitialProps자체 내보내기여야 합니다.
Move the method to it's own export from your page.
고치기 전
function Page(props) {
return <p>hello world</p>
}
Page.getStaticProps = () => ({
props: {
hello: 'world',
},
})
export default Page
TypeScript
복사
변경 후
function Page(props) {
return <p>hello world</p>}
export default Page
export const getStaticProps = () => ({
props: {
hello: 'world',
},
})
TypeScript
복사
export default function Post({ post }) { // 컴포넌트에 default를 빼먹지 말자.
console.log(post);
return (
<div className="post">
<h1>{props.title}</h1>
</div>
);
}
export async function getStaticPaths() {
const res = await fetch(`http://localhost:1337/api/posts/`);
const posts = await res.json();
// paths will be an array of the paths to the posts
const paths = posts.data.map((post) => ({
params: {
slug: post.attributes.Slug,
},
}));
console.log(`paths`, paths);
return {
paths,
fallback: false,
};
}
export async function getStaticProps({ params }) {
const { slug } = params;
const res = await fetch(`http://localhost:1337/api/posts/${slug}`);
const data = await res.json();
const post = data[0];
return {
props: {
post,
},
};
}
TypeScript
복사
