Nuxt 中同一级别的多个动态路由可能吗?

Posted

技术标签:

【中文标题】Nuxt 中同一级别的多个动态路由可能吗?【英文标题】:Multiple dynamic routes on the same level in Nuxt possible? 【发布时间】:2021-05-23 21:12:43 【问题描述】:

在 NuxtJS 中是否可以在同一级别上拥有多个动态路由?

我试过了,但它不起作用:

pages
--_article.vue
--_city.vue

我正在使用 Nuxt Content,并希望在同一页面级别上以独特的布局/设计动态加载不同的内容。

【问题讨论】:

你的意思是子路由吗?就像您有一个页面,并且在该页面中您有不同的路线。例如,您有这样的帐户页面/帐户,并且其中有不同的页面。 /account/main, /account/更改密码。像这样? 我正在寻找一种在顶层提供不同内容的方法,如下所示:/article1、/article2、/city1、/city2 等。但每个都有不同的布局/设计两种类型的内容。不确定 Nuxt 是否有可能 如果您接受我的回答,如果它对您有用,我将不胜感激。 ***.com/help/someone-answers 【参考方案1】:

您可以简单地为城市和文章创建两条不同的路线,并在它们下动态生成路线。例如,您的 pages 文件夹应如下所示:

---| article
-----| _slug.vue
---| city
-----| _slug.vue

有了这个,你可以实现如下路线: /city/:city_id /article/:article_id

【讨论】:

以上是关于Nuxt 中同一级别的多个动态路由可能吗?的主要内容,如果未能解决你的问题,请参考以下文章

Nuxt.js 中的无限动态级别嵌套

生成后在 Nuxt SPA 中使用动态路由

Nuxt的动态路由及路由校验入门

Apache驼峰单个文件的多个动态路由

Nuxt配置动态路由以及参数校验

页面重新加载后 Nuxt 动态路由返回 404