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中找不到任何内容），或者是一种在每次语言更改时都重新呈现列表的方法。

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

Answer 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文件中，则需要注意。

Vue-i18n和列表

1 个答案: