Nuxt - implement dynamic routing to pass multiple parameters, add multiple parameters separated by "/" slashes to the path URL (do not use _id.vue to create files in this way) detailed example tutorial, beginners can get started directly!

foreword

The tutorials on the Internet are all ways to create files _参数名.vue, which cannot achieve multiple parameters (and use /to split each parameter).

This article implements the dynamic routing of the address bar in the Nuxt.js project, uses "/" to splice multiple parameters, and how to obtain these parameters,

You can refer to the examples provided in this article and follow the tutorial to "perfectly reproduce" this effect into your project.

---

As shown in the figure below, multiple parameters are defined infinitely, and no error will be reported even if they are not passed.

In the page, these parameters can be easily obtained in the route.

first step

I have created a "clean" new project here, without any other business logic, so that it is easy for you to read.

Let's take pages/index.vuethe home page as an example. Its current directory structure is like this, as shown in the following figure: