Home

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