Set locale dynamically at runtime

Hello,

It unclear to me from the docs if using setLocaleMessage() is how you get dynamic locales at runtime to work. There are many articles about how to do that at build time, but none that I could see about runtime changes.

To give an example, here is what I mean in the form of a timeline:

1. App loads, reads locale requirement.
2. Makes AJAX call to fetch the appropriate JSON file (e.g. en.json).
3. Calls setLocaleMessage() as shown below:

const i18n = new VueI18n({...});
...
i18n.setLocaleMessage('en', {...pathsHere});
...
//Later on:
//After another AJAX call to fetch fr.json:
i18n.setLocaleMessage('fr', {...pathsHere});

[ghost]

There should be some easy way to change the global language/locale at run-time / dynamically and it should be documented very well and at a central point because this IMHO is an essential feature of this type of library.

[BenoitRanque]

Here is my solution:

  app.i18n = new VueI18n({
    locale: 'es',
    fallbackLocale: 'es',
    messages
  })

  Object.defineProperty(Vue.prototype, '$locale', {
    get: function () {
      return app.i18n.locale
    },
    set: function (locale) {
      app.i18n.locale = locale
    }
  })

  // this part happens later
 
 new Vue(app)

Usage:

this.$locale // root Vuei18n locale

this.$locale = 'en' // set root Vuei18n locale

Edit: this works too:

this.$root.i18n.locale // root Vuei18n locale

this.$root.i18n.locale  = 'en' // set root Vuei18n locale