Vue.js Vue I18n在更改区域设置时删除组件内容

我正在将Vue I18n集成到我的应用程序中。我有一个从Vuex存储中呈现的列表，下面我有一些带有区域设置切换器的可翻译内容（无需重新加载页面）。当我切换语言时，字符串被翻译，但之前的内容消失了

我使用的是Vue-I18n推荐集成的单文件组件

Vue.use（VueI18n）
常量消息={
嗯:{
信息：{
你好：“你好，世界”
}
},
ja:{
信息：{
你好：'こんにちは、世界'
}
}
}
常数i18n=新VueI18n({
地区：'en'，
信息，
})
const app=新的Vue({
路由器，
商店，
i18n，
组成部分：{
...
}
}).$mount（“#应用程序”）

这是我的模板的一部分

我的产品
{{prod.name}
{{$t（“message.hello”）}

{{lang}}

products对象来自Vuex商店，如下所示

计算：{
产品（）{
返回此值。$store.state.products.values（）
}
}

---

我希望locale开关能够动态更新字符串，而不会影响上面的列表。产品名称毕竟不需要翻译。产品列表最初正确呈现，当我更改区域设置（无页面重新加载）时，它将消失。我仍然在Vue开发者工具中看到该组件，因此它在那里，但内容不见了。

我怀疑这与Vue如何检测对象的更改有关，但我所要做的只是对计算方法进行一点修改，不要返回

值

只需返回Map对象，让

v-for

调用

值

计算：{
产品（）{
退回此。$store.state.products
}
}

---

我怀疑这与Vue如何检测对象的更改有关，但我所要做的只是对计算方法进行一点修改，而不是返回

值

只需返回Map对象，让

v-for

调用

值

计算：{
产品（）{
退回此。$store.state.products
}
}

你能告诉我你在哪里调用products（）？@mare96它在循环中

v-for=“prod-in-products”

。或者你是说我在哪里初始化它到商店？你在调用

computed

hook中的

products（）

？@mare96是的，对不起。我将更新问题以澄清您是否尝试将此。$store.state.products.values（）分配给组件中的其他变量？您能否显示调用products（）的位置？@mare96它在循环中

v-for=“prod in products”

。或者你是说我在哪里初始化它到商店？你在调用

computed

hook中的

products（）

？@mare96是的，对不起。我将更新问题以澄清您是否尝试

this.$store.state.products.values（）

分配给组件中的其他变量？