3

I'm trying to expand the already loaded localizations for a specific component and I would like to do something like this:

export default {
  name: 'General',
  components: {
    Header,
    Content,
    NextPageButton
  },
  i18n: {
    messages: {
      [this.$i18n.locale]: { message: require('@/locales/' + this.$i18n.locale + '/tso/general.json') }
    }
  }

Problem is of course that the $i18n is undefined inside the i18n options. How can I retrieve the current locale here?

DanteC
  • 178
  • 1
  • 9

1 Answers1

3

I use the Vue instance like: this.Vue.$i18n.locale

Another way of access is this.$root.$i18n.locale

Flink
  • 1,008
  • 1
  • 13
  • 23
  • 1
    Can you import Vue from 'vue' ? Otherwise maybe also check the this.$root object – Flink Mar 02 '20 at 16:39
  • Thanks! this.$root.$i18n.locale did the trick! Is it bad practice to use? – DanteC Mar 02 '20 at 16:52
  • No not in particular. In general try to keep i18n jobs top down, but I've also ran into a use case where i needed access from the component – Flink Mar 02 '20 at 16:56