Possibility to localize dynamic routes

[metalanti]

What problem does this feature solve?

I'm not sure if it is possible :)
I have a route /article/:slug (en) and I'd like to translate it to other languages with translated slug
Eg: (en) /article/first-article and (de) /de/artikel/erste-artikel

Now I can do this:
article.vue

i18n: {
  paths: {
    de: '/artikel/:slug'
  }
},
data () {
  return {
    article: { // it comes from asyncData
      // title: { en: '...', de: '...' },
      // slug: { en: '...', de: '...' }
    }
  }
}

but I can't change the slug based on the article's data

What does the proposed changes look like?

I think the i18n.paths[locale] should accept a function with the access of this (data) and should return some Object:

de () {
  return {
    path: '/artikel/:slug',
    params: {
      slug: this.article.slug.de
    }
  }
}

_{This feature request is available on Nuxt.js community (#c74)}

[paulgv]

Hi @metalanti
This can already be achieved by passing the translated slug to <nuxt-link>, it might look something like this (not necessarily the best way but it should give you some pointers):

<template>
  <nuxt-link :to="localePath({ name: 'article-slug', params: { slug: myTranslatedSlug } })">
    article
  </nuxt-link>
</template>

<script>
export default {
  computed () {
    myTranslatedSlug () {
      const { locale } = this.$i18n
      if (locale === 'de') {
        return 'nachrichten'
      }
      return 'news'
    }
  }
}
</script>

[metalanti]

thank you!
so it's a solution,
but the Lang switcher with switchLocalePath won't work this way

I think if my request can be done, it would be more elegant :)

[ptdev]

I think this is exactly what I was asking here

Right now, we can place pretty much all other content that's to be translated in some external file or backend. The only missing strings are exactly the urls.

@paulgv If there's any way to have the component's nuxtI18n property have access to data fetched on asyncData before the router generation that would be great! I'm assuming they have to be hardcoded so you can use acorn at build time to create the router (?)

@metalanti did you ever find some way to accomplish what you were asking initially?

[metalanti]

@ptdev we have the same problem, but mine is not urgent. i have still no solution

[ptdev]

Hi @metalanti , my problem is also not really urgent. It's just one of those "would be great to have" features.
Thanks for replying though, cheers!

[furyscript]

Anyone have news on this issue?
I need really urgent this feature.

[urbgimtam]

I'm also searching for an update on this issue.

[praffn]

I'm chiming in here too, can't for the life of me figure out an elegant solution.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[danivaan]

bump

[paulgv]

Here's my attempt at supporting dynamic parameters translation in nuxt-i18n: #345

Please read the PR description to see how you can try it yourselves. I'd love to have some feedback on this!

[katerlouis]

Any news?
Also looking for dynamic route paths translation.

The proposed solution to pass a function to paths: is what I had in mind aswell.
Rookie here, though... so I don't know if it's possible to expose context, i18n etc. to this function under the hood.

[Pezhvak]

This can't do much, since it's compile time micro and cannot be useful when loading data from an API.