Nuxt JS / Vue中的动态URL路径

时间:2018-08-01 16:19:21

标签: javascript vue.js vue-router nuxt.js

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

但是,我的后端开发人员拥有一个CMS,该CMS吐出JSON并链接到完全位于动态URL上的页面。

例如/about-us/people/michael/

我无法提前知道如何使用Nuxt的基于文件的系统路由此类URL。

某些链接可能类似​​于:/articles/hello-world/等。

无论嵌套走了多远,是否有关于如何捕获所有路线的信息?

我可以通过拥有index.vue_slug.vue(例如/about-us/)来进行第一阶段的学习。除此之外,如何解决/about-us/people/等问题而不抛出 404 。这是一个谜。

不胜感激。

1 个答案:

答案 0 :(得分:3)

您可以使用extendRoutes

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