next-netlify-blog-starter icon indicating copy to clipboard operation
next-netlify-blog-starter copied to clipboard

Full page refresh when clicking blog posts.

Open tr1s opened this issue 4 years ago • 2 comments

Hi!

I just went through your blog post on Netlify and was going to compare what I had just learned on Next's learn-starter blog to see what you both did differently for my own curiosities (still processing).

I noticed though when I clicked a blog post (from post list on the index page) I would get a full-page refresh when going to the blog post. I couldn't see what I did wrong so I came here to clone this repo and I got the same behaviour.

I preserved my logs and this is what I get:

CleanShot 2020-05-14 at 22 45 43@2x

But the post will still show up, but first it get's an error and refreshes.

Do you not get this behaviour? Not quite sure what's up 🤷🏽‍♂️

tr1s avatar May 15 '20 02:05 tr1s

Hey, the issue happens because the <Link /> in the PostLink component should point to a dynamic route.

You can find more info about it in the docs.

Here's a working version:

<Link href="/posts/[postname]" as={`/posts/${post.slug}`}>
  <a>{post.frontmatter.title}</a>
</Link>

matiasleidemer avatar May 17 '20 13:05 matiasleidemer

Ah good call, missing the as attribute! Ty

tr1s avatar May 17 '20 14:05 tr1s