Home > Software design >  Vue 3 i18n Locale Not Updating (Composition API)
Vue 3 i18n Locale Not Updating (Composition API)

Time:10-08

I'm trying to change the Vue-i18n locale with a button click. But when I click on the button nothing happened. There is also no error at all. How to fix this?

<button v-on:click.prevent="setLocale('id')">Ind</button>
<button v-on:click.prevent="setLocale('en')">Eng</button>

import i18n from "../i18n";
const setLocale = (lang) => {
  i18n.global.locale = lang;
};

CodePudding user response:

There may be other things, but there's at least one mistake in the code. i18n.global.locale is a ref and should be used as:

const setLocale = (lang) => {
  i18n.global.locale.value = lang;
};

It cannot be reactive the other way.

  • Related