Vue.js 如何阻止i18n在Vue上重新加载页面时恢复为默认区域设置？

我正在使用i18n在Vue上翻译我的应用程序。我已经创建了一个组件名LocaleChanger，允许用户更改应用程序语言。我在两个不同的地方使用它：登录页面和仪表板页面

默认的区域设置语言是西班牙语。 我在登录页面，我将语言更改为英语，登录并推到仪表板。语言仍然是英语。但如果我重新加载页面，语言将变为西班牙语。我怎样才能阻止这种事情发生

这是我的组件

mdi网络
{{$store.getters.getApplLanguage}
mdi菜单关闭
导出默认值{
名称：“LocaleChanger”，
数据（）{
返回{
selectedLanguage:this.$store.getters.getApplLanguage，
项目：[
{
文本：“ES”，
},
{
文本：“EN”，
},
],
}
},
方法：{
//根据用户选择的语言设置本地i18n语言
设置语言（项目）{
如果（item.text='ES'）{
i18n.locale='es'
此.$store.commit（'setAppLanguage'，'ES'）
}else if（item.text==“EN”）{
i18n.locale='en'
此.$store.commit（'setAppLanguage'，'EN'）
}
},
},
}

这是i18n.js

Vue.use（VueI18n）
常量消息={
嗯:{
…需要（'@/locales/en.json'），
$vuetify:en，
},
es:{
…需要（'@/locales/es.json'），
$vuetify:es，
},
}
导出默认的新VueI18n({
语言环境：process.env.VUE_APP_I18N_语言环境| | es'，
fallbackLocale:process.env.VUE_APP_I18N_FALLBACK_LOCALE|||'en'，
信息，
})

您可以使用

localstorage

保存信息

在您的商店中，尝试从

localStorage

获取

appllanguage

导出默认的新Vuex.Store({
声明：{
appllanguage:localStorage.getItem（“appllanguage”）|| process.env.VUE|u APP|u I18N|u LOCALE|||es'
},
吸气剂：{
GetApplLanguage：（state）=>state.ApplLanguage
},
突变：{
SetApplLanguage（州、语言）{
state.appllanguage=语言；
setItem（“language”，language）；//无论何时更改ApplLanguage，都会将其保存到localStorage
}
}
})

然后使用存储中的值初始化

localStorage

从“/store.js”导入存储；
导出默认的新VueI18n({
区域设置：store.getters.appllanguage，
信息，
})

---

谢谢：locale:store.getters.appllanguage！！！