Блог

В настоящее время я использую 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>
 

Попробуйте использовать вычисляемое свойство, возвращающее переведенное название :

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

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