I am building a simple blog website with Next.js and Sanity. I am able to render the list of posts on a /blog
route, but when I click the link to navigate to a specific post, I am unable to render anything to the screen.
import client from '../../client'
export default function Post({post}) {
console.log(post)
return (
<main className="px-5 m-auto mt-10 max-w-7xl">
<h1 className="text-5xl font-bold"></h1>
</main>
)
}
export const getStaticPaths = async () => {
const paths = await client.fetch(
`*[_type == "post" && defined(slug.current)]{
"params": {
"slug": slug.current
}
}`
)
console.log(paths)
return {
paths,
fallback: true,
}
}
export const getStaticProps = async ({params}) => {
const query = `*[_type == "post" && slug.current == $slug][0]{
_id,
_createdAt,
title,
author->{
name,
image
}
mainImage,
slug,
body
}`
const {slug} = params
const post = await client.fetch(query, {slug})
return {
props: post,
}
}