How to pass multiple parameters in Nuxt?

1196 views javascript
0

In Nuxt.js if I have in pages/posts/_id.vue this code:

<template>                                                                                                                                                              
  <div>                                                                                                                                                                 
    Post id: {{$route.params.id }}                                                                                                                                    
  </div>                                                                                                                                                                
</template> 

When I type in the URL: http://localhost:3000/posts/123, it displays Post id: 123.

So I learned how to pass one parameter through the URL.
But I want to pass also the category to which the post belongs to and display a message like this one: Post id: 123. Category: News.

  • How can I structure the posts folder and get the result I want?
  • And how to access the URL in this case? Something like http://localhost:3000/posts/123/News` ?

answered question

1 Answer

9

See Dynamic Nested Routes in the documentation. Your directory structure should look like this:

pages/
--| _category/
-----| _id.vue

The URL will be http://localhost:3000/posts/News/123.

posted this

Have an answer?

JD

Please login first before posting an answer.