reactjs - "getInitialProps"页结果 "/[slug]"中的循环结构

Question

我收到此错误，已阅读文档和其他答案，但仍然不明白为什么。

我想做的是一个api调用，如果有匹配的post，我想呈现Post组件，如果没有，我想重定向或呈现错误页面。

当我点击现有的帖子链接时，我会收到帖子，但是当我随机放置一些东西以生成 404 状态时，我会收到标题错误。

这是我的帖子页面:

const PostPage = ({ post }) => {
    return (
        <>
            {post.status === 200 ? (
                <Post post={post.data.items[0]} />
            ) : (
                <Error statusCode={post.status} />
            )}
        </>
    );
};

PostPage.getInitialProps = async ({ query }) => {
    const post = await getPostBySlug(query.slug);
    return { post };
};

和我的 _error.js 页面:

function Error({ statusCode }) {
    return (
        <p>
            {statusCode
                ? `An error ${statusCode} occurred on server`
                : "An error occurred on client"}
        </p>
    );
}

Error.getInitialProps = ({ res, err }) => {
    const statusCode = res ? res.statusCode : err ? err.statusCode : 404;
    return { statusCode };
};

完整代码:
https://gitlab.com/flakesrc/blog-webstation-next

Answer 1

不是返回 {post}，而是返回 post.data。它将解决问题。