小编nic*_*ers的帖子

NextJS getStaticProps 未将返回的 props 传递给页面

我在获取 getStaticProps 函数将返回的 props 传递到 NextJS 中的模板页面时遇到一些问题。

这是我目前的动态页面模板的代码。

// src/pages/blog/[slug].js
import React from 'react';
import matter from 'gray-matter';
import ReactMarkdown from 'react-markdown';

import Layout from '../../components/layout';

export default function BlogPost ({frontmatter, markdownBody}){
    console.log(`in template Layout: ${frontmatter.title}`)
    // Output: TypeError: Cannot read property 'title' of undefined
    return (
        <Layout>
            <h1>{frontmatter.title}</h1>
            <span>{JSON.stringify(markdownBody)}</span>
        </Layout>
    )
}

export async function getStaticProps({...ctx}){

    const {slug} = ctx.params;
    console.log(slug)
    // output: first post (this is correct)
    const content = await import(`../../posts/${slug}.md`)
    const data = matter(content.default)
    console.log(`In getStaticProps: …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs next.js react-props getstaticprops

3
推荐指数
1
解决办法
7013
查看次数