Nuxt JS / Vue 中的动态 URL 路径

Question

Nuxt JS 基于文件系统创建路由。您通常需要为动态参数设置模板，例如 _id.vue 等

但是，我的后端开发人员有一个 CMS，它吐出 JSON 链接到完全动态 URL 上的页面。

例如/about-us/people/michael/

我无法提前知道这些 URL 应该如何使用 Nuxt 的基于文件的系统进行路由。

一些链接可能如下所示：/articles/hello-world/ 等

是否有关于我如何捕捉所有路线的信息，无论嵌套有多远？

我可以通过 index.vue 和 _slug.vue（例如 /about-us/）完成第一关。除此之外，我如何在不抛出 404.

的情况下解决 /about-us/people/ 等问题是个谜

非常感谢帮助。

Answer 1

你可以使用 extendRoutes

module.exports = {
  router: {
    extendRoutes (routes, resolve) {
      routes.push({
        name: 'catchall',
        path: '*',
        component: resolve(__dirname, 'pages/catchallpage.vue')
      })
    }
  }
}

Nuxt JS / Vue 中的动态 URL 路径

Dynamic URL paths in Nuxt JS / Vue

javascript

vue.js

vue-router

nuxt.js