vue.js - vue-i18n 如何在js(运行时)中刷新/访问$i18n.locale 后保持语言？

Question

我不知道如何在运行时访问 $i18n.locale。因此我不知道如何将它保留在我的 session 中，以便在页面刷新时它不会回到英文。

<select class="dropdown-menu-lang " aria-labelledby="dropdown07" v-model="$i18n.locale" @change="langChanged($i18n.locale)" >
          <option class="dropdown-item-lang" v-for="(lang, i) in langs" :key="`Lang${i}`" :value="lang">{{ lang }}</option>
</select>

langs: ['fr', 'en'],

这是我尝试过的

mounted(){
     if(localStorage.Lang!=null) $i18n.locale=localStorage.Lang; //how to access $i18n.locale ??
 },

langChanged(lang){
      localStorage.Lang=lang; //this is OK
},

这是我在 app.js 中定义所有内容的方式

import Vue from 'vue';
import Vuetify from 'vuetify';
import VueInternationalization from 'vue-i18n';
import Locale from './vue-i18n-locales.generated.js';

Vue.use(VueInternationalization);

const lang = document.documentElement.lang.substr(0, 2); 

const i18n = new VueInternationalization({
    locale: lang,
    messages: Locale
});

非常感谢

Answer 1

在您必须使用“this”的子组件方法之一中访问 $i18n

mounted(){
 if(localStorage.Lang!=null) this.$i18n.locale=localStorage.Lang; 

},