Stop nuxt from looking in folders in specific scope

Question

I have a url called eg: https://example.com/category/laptop/keyboard .

Normal behaviour is that nuxt automatically looks inside /pages for a "category" folder (which is fine) and then further more: "laptop" folder and last "keyboard" folder in which should contain a vue file.

I would like that "laptop/keyboard" is referred to a :slug param instead of folder traverse but only in the scope of /category/ . Is that possible? It's because of sub-nested categories.

I have tried to add a custom route example:

router: {
  extendRoutes(routes, resolve) {
    routes.push({
      name: 'custom',
      path: '/product-category/*',
      component: resolve(__dirname, 'pages/produkt-kategori/_category')
    })
  }
},

Unfortunately this does not work, it's just reverting to 404. Furthermore I can't get the params with that.

Answer 1

So. Found out that I needed to use "Unknown Dynamic Nested Routes", referring to this documentation: https://nuxtjs.org/docs/2.x/features/file-system-routing .

Just create a _.vue file in a sub-folder, then everything after a scope will become dynamic, also nested.