javascript - Nuxt JS/Vue 中的动态 URL 路径

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

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

但是,我的后端开发人员有一个 CMS,它可以输出 JSON,其中包含指向完全动态 URL 上的页面的链接。

例如/about-us/people/michael/

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

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

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

我可以通过使用 index.vue_slug.vue 来完成第一级(例如 /about-us/ )。除此之外,我如何解决 /about-us/people/ 等而不抛出 404 是一个谜。

非常感谢您的帮助。

最佳答案

您可以使用extendRoutes

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

关于javascript - Nuxt JS/Vue 中的动态 URL 路径,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51638038/

相关文章:

vue.js - Navigation Guards beforeEach 无限循环

vue.js - 我们如何在 NUXTJS 中设置默认路由

javascript - 通过 JavaScript 检测 Electron 实例

javascript - 如何在 Highcharts 中绘制每个类别的线?

javascript - 简单的 Javascript Jquery 不起作用

vue.js - 使用 Vue.js 和 SSR 的服务器端水合

javascript - 避免在 Nuxt VueJs 中直接改变 Prop

javascript - 如何修改下拉文本 onchange 事件和 onclick 当选择框展开时应具有原始值

javascript - Vue 组件呈现为注释?

javascript - 如何从 nuxt 路由器模块的 router.js 文件访问 Vuex 存储?