Vue-i18n 和列表

Question

我目前正在使用 vue-i18n 进行国际化，但在本主题中遇到了列表问题。可以使用永久导航栏上的下拉菜单更改语言。 有一个组件 A 和一个子组件 B。在这个子组件中有两个列表，通过以下方式填充：

<select id="element1" class="ui dropdown" v-model="application.datatable">
    <option value="">... ... ...</option>     
    <option v-for="i in tableRows"  :value="i.id">
        <p>
            {{$t(i.element.name)}}
        </p>
    </option>
</select>

这里我遇到了问题，{{$t(i.element.name)}} 被正确翻译，但在第一次初始化后不会改变。因此，如果我将语言从英语更改为德语，所有其他标签和字符串都会更改，但列表仍然是英语（Wochentag：|Monday|Tuesday|...）

为此，我需要一种重新呈现列表的可能性（可能通过 id，但在 jQuery 中没有发现任何内容），或者在每次语言更改时重新呈现列表的方法。

有人对此有想法吗？ 非常感谢！ 广告

Answer 1

1. 将您的选择绑定到 html 中的 ($i18n.locale)

<select name="lang" v-model="$i18n.locale">
    <option v-for="lang in langs" :value="lang">
        @{{ $t('general.' + lang) }}
    </option>
</select>

注意：大括号前的@符号是因为这段代码在我的.blade.php文件中。如果您在.vue 文件中，则需要注意。