postdata.js

export const PostData = [
    {
        id: 1,
        slug: "see-the view",
        title: "See the view",
        content: <> <h1>Hey There </h1> </>
    }
]

[postslug].js

import {PostData} from '../../data/postdata'
export async function getStaticProps({ params }) {
        const posts = PostData.filter((p) => p.slug === params.postslug)
        console.log(posts)
        const mainpost = JSON.stringify(posts)
        return {
          props: {
            post : mainpost[0]
          }
        }
      }
      export async function getStaticPaths() {
        const paths = PostData.map(post => ({
            params : {postslug : post.slug}  
        }))
    
        return {paths, fallback : false}
        
      }
    
      
    const Post = ({post}) => {
    
        return (
            <>
    
                {post.content}
            </>
    
        )
    }
    
    export default Post;

Postdata.js file is containing array of objects. I am trying to fetch the data of blog article using getStaticProps and getStaticPaths. But nothing is displaying.

CodePudding user response：

There are 2 ways