如何将翻译后的文本传递给 vue js 中的数据

Question

我目前正在使用vuei8n 进行翻译。必须承认我发现文档有点难以理解。

我目前有一个名为 Forex.vue

的组件

    <i18n>
    {
      "en": {
        "title": "What is Forex ? ",
       
      },
      "zh": {
        "title": "什么是外汇？"
      }
    }
    </i18n>

<template>
  <div> {{$t('title')}}</div> //this works
</template>

但我想做的是这个

<template>
  <div> {{title}}</div>
</template>

<script>
export default {
  name: "Forex",
  data() {
      return {
          title: $t('title')  =============> How to pass the translated text inside title
      }

  }
}
</script>

Answer 1

尝试使用经过计算的属性 return 翻译后的标题 :

<template>
  <div> {{title}}</div>
</template>

<script>
export default {
  name: "Forex",
 computed:{
   title(){
      return this.$t('title')
  }
}
}
</script>

如何将翻译后的文本传递给 vue js 中的数据

How to pass translated text to data in vue js

translation

vue.js