Blog tutorial path rendering with /blog-post?id=X

I’m probably missing something obvious in my code, but running into this issue following along with the routing portion of the tutorial:

The “Link to” path to posts are rendering like this:
http://localhost:8910/blog-post?id=1

BlogPostsCell.js

{post.title}

Routes.js

Navigating to blog-post/1 works fine, so Routes.js appears to be fine, its the cell rendering the link that appears to be off.

Any tips as to where I might have gotten off track would be appreciated!

1 Like

Hey @ehartstrom. I think you’re missing {id} somewhere in one of your Routes’ path props in Route.js.

When you pass arguments to the generated routes functions, if the object’s keys don’t exactly match what’s between the {} in the path, they’ll tack the key-value pair on as a query, which is what you’re seeing.

For example, if the path is '/tags/{tag}', and you pass { tag: 'code', extra: 'foo' }, you’ll end up with '/tags/code?extra=foo'.

Does that help?

1 Like

Thanks for asking @ehartstrom! And definitely check out what Dom suggested above.

If you’d like to see an example repo of the finished Tutorial code, here’s my up-to-date example:

Hope this helps.