Static GitHub Issues

[2403] Override/replace router

prev: A lot of repeating code in nuxt build pages
next: vue-cli · Failed to download repo vuejs-templates/nuxt-community: Response code 404 (Not Found)

Hello,

I'm looking for a solution to simplify my routing, usecase may be i18n or organization mangagement for a dashboard. I'll take a combined example :

Files tree :

  • _lang
    • organizations
      • _organization_id
        • index.vue
        • edit.vue
        • something.vue
        • other-thing.vue

Here, when I want to nuxt-link something.vue I have to do : <nuxt-link :to="{name: "lang-organizations-organization_id-something", params: {lang: $route.lang, organization_id: $route.organization_id} }">Link</nuxt-link> ...

In a whole project, it's boring :/

Solutions that I've in mind : Override to add modifiers in "to" (expected design : <nuxt-link :to.i18n.org="{ name: "something" }">Link</nuxt-link>) or add directives (expected design : <nuxt-link :to="{ name: "something" }" i18n org>Link</nuxt-link>)

I'm not able to hack nuxt-link in a plugin (Vue.component('nuxt-link') return undefined), I guess that it's defined not in Vue level but in App level ?

Anyway, seems to not been possible in vue-router, so I'm considering the fact of fork/PR vue-router, or pick another router (Directory/Page ?), at least while I'm trying to hack but it's not easy.

How can I do that ?

Maybe, the most radical answer to this issue is to move routing into module for 1.x branch ? Maybe use provide/inject of Vue 2.2 ?

I'm trying to workaround with filters for now (expected design : <nuxt-link :to="{ name: "something" } | route-deep('i18n', 'org')">Link</nuxt-link>)

Thanks for your time & your help.

Gaël

<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c2088">#c2088</a>)</em></sub></div>