Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Can't access non-loaded lazy locales using $t #740

Closed
matnowak opened this issue May 28, 2020 · 7 comments · Fixed by #2799
Closed

Can't access non-loaded lazy locales using $t #740

matnowak opened this issue May 28, 2020 · 7 comments · Fixed by #2799

Comments

@matnowak
Copy link

Hello.

I was trying to put two different languages on the same page.
In my example, I'm trying to pull messages for two different languages i.e. polish and french.
The idea is to get language from a browser (fr) and compare it to language from URL(pl) which will show the message about difference and choose between two of them. That message should be in those two languages that I've got from the browser and URL.

I tried use v-t directive with the locale attribute, but it seems to not work as I expected.
Tried also $t with same effect.

After checking i18n object I had only current language messages (in this situation polish) and both strings were translated into polish only...

My nuxt-i18n config

  parsePages: false,
  locales: LOCALES,
  defaultLocale: process.env.NODE_ENV !== 'production' ? 'en' : 'en-gb',
  lazy: true,
  langDir: 'lang/',
  vueI18n: {
    fallbackLocale: 'en',
    silentFallbackWarn: true,
    formatFallbackMessages: true,
  },

Is there any possibility to use both languages on the same page?

@rchl
Copy link
Collaborator

rchl commented May 28, 2020

The $t API [1] takes a locale argument so you could use that if you would have all locales loaded. But since you are lazy loading them, you can't do that.

Interestingly, there is no way to trigger loading of additional locales right now, short of changing to a given locale. I guess it makes sense to add that. Then you would need to manually ensure that all locales you want to use are loaded before you try to get the translations for that locale.

Would that work for you? You would need to programmatically call something like await $i18n.loadLocale('fr') before using it.

[1] https://kazupon.github.io/vue-i18n/api/#vue-injected-methods

@matnowak
Copy link
Author

matnowak commented Jun 1, 2020

Thank you for the quick answer and sorry about that late response from my side.

Of course - any possibility to add additional language "on the fly" would be nice to have in case of my problem.

Although best would be if I could select some language i.e. in $t and that language would be lazy-loaded automatically, but as I said above - adding it manually and checking if lang is loaded before usage sounds good as well.

@rchl
Copy link
Collaborator

rchl commented Jun 1, 2020

Although best would be if I could select some language i.e. in $t and that language would be lazy-loaded automatically

That's technically not doable as $t is a sync API while loading languages is async. So that would make the API not backward-compatible and also async API wouldn't work from templates.

@matnowak
Copy link
Author

matnowak commented Jun 1, 2020

Makes sense. Manual loading locale sounds good too :)

Pozdrawiam :)

@stale
Copy link

stale bot commented Aug 22, 2020

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.

@Louvki
Copy link

Louvki commented Mar 1, 2021

Any updates on this?

@rchl rchl mentioned this issue Sep 12, 2021
@rchl rchl changed the title Double language on one page Can't access non-loaded lazy locales using $t Jul 24, 2022
@rchl rchl added v8 v7 locale and removed v7 labels Jan 3, 2024
@mtdvlpr
Copy link

mtdvlpr commented Jan 6, 2024

@rchl any updates?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants