Vue 3 i18n Locale Not Updating (Composition API)

There may be other issues, but there's at least one error 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.

In Vue 3 with Composition API, use the following:

import { useI18n } from 'vue-i18n';

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