如何使用Vue i18n库翻译项目

Question

我有一个以这种方式显示文本的元素

 <div class="body-1 mt-4">{{ item.titleDesc }}</div>
            </v-card-title>
            <v-card-text class="project-description">
              <v-layout row fill-height v-for="(desc, index) of item.description" :key="index">
                <v-flex
                  xs4
                  class="text-xs-right font-weight-bold text-uppercase caption px-2 py-1"
                >{{ desc.name }}</v-flex>
                <v-flex xs8 class="text-lowercase desc-text px-2 py-1">{{ desc.text }}</v-flex>
              </v-layout>
            </v-card-text>

{{ item.titleDesc }}，{{ desc.name }}，{{ desc.text }}我有jason

 "items": [
    {

      "titleDesc": "same text",
       "description": [
        {
          "name": "same text", 
          "text": "same text "
        },

我有翻译的json。

{"en-US":{"same text":"same text","same text":"same text"}

有一个检查密钥的循环

Object.keys(fileJsonObject).forEach((languagesJson) => {

              messages[languagesJson] = Object.assign(messages[languagesJson] ? messages[languagesJson] : {}, fileJsonObject[languagesJson])

            })

我需要项目通过我的杰森与翻译，然后displayed.How来做它？请帮帮忙，我对此完全陌生

Answer 1

尝试用{{ $t(desc.text) }}替换{{ desc.text }}

请参阅docs

如果你有Vue-i18n setup correctly，它应该可以正常工作……