so, thanks for u who will try to help me, im comming from some months in laravel for start to study nuxt, and i need to make a specific type of translate thats difficult to find information about

Im trying to put some objects in the array, each object has 3 propertys: 3 different languagues of same string. I have a function that return the correcly object string, but im not familiar with how can i get the local for my function. Its something im doing to study, i really cant find much information searching in internet. I already know and can do the translation using a locales file, but i want to make this structure to in the future get the information from a API.

Until now what happens is, everything run ok, my computed function return a random item from array to my screen, but im trying to get the local and the result of translate function before the math.random.

My code:

LoadingBar.vue

<template lang="html">
  <div class="loading-page" v-if="loading">
    <h1 class="title">Estamos preparando o terreno para você</h1>
    <img src="~/assets/media/photos/agronomy.png" />
    <p class="text">{{tiprandom}}</p>
  </div>

</template>

<script>
import randomtip from '~/components/randomtip.vue'
export default {

layout: 'blank',

components: {
  randomtip
},

      data: () => ({
           loading: true,
           tipolocal_id: 1,
           dicas: [
             {id:1, nome: 'Dica 1: Considere uma atenção maior às mudas, pois são bem sensíveis. É importante deixar o vaso em um local sombreado e de olho sempre na irrigação',
                    nome_en: 'Dica 1: Consider paying more attention to the seedlings, as they are very sensitive. It is important to leave the pot in a shaded place and always keep an eye on irrigation',
                    nome_es: 'Dica 1: Considere prestar más atención a las plántulas, ya que son muy sensibles. Es importante dejar la maceta en un lugar sombreado y vigilar siempre el riego.'
                    },
             {id:2, nome: 'Dica 2: Considere uma atenção maior às mudas, pois são bem sensíveis. É importante deixar o vaso em um local sombreado e de olho sempre na irrigação',
                    nome_en: 'Dica 2: Consider paying more attention to the seedlings, as they are very sensitive. It is important to leave the pot in a shaded place and always keep an eye on irrigation',
                    nome_es: 'Dica 2: Considere prestar más atención a las plántulas, ya que son muy sensibles. Es importante dejar la maceta en un lugar sombreado y vigilar siempre el riego.'
                    },
             {id:3, nome: 'Dica 3: Considere uma atenção maior às mudas, pois são bem sensíveis. É importante deixar o vaso em um local sombreado e de olho sempre na irrigação',
                    nome_en: 'Dica 3: Consider paying more attention to the seedlings, as they are very sensitive. It is important to leave the pot in a shaded place and always keep an eye on irrigation',
                    nome_es: 'Dica 3: Considere prestar más atención a las plántulas, ya que son muy sensibles. Es importante dejar la maceta en un lugar sombreado y vigilar siempre el riego.'
                    },
             ],
    }),
           computed: {
                  tiprandom () {
                    return this.dicas[Math.floor(Math.random()*this.dicas.length)]
                  },
                locale() {
                          if (this.$i18n.locale == 'pt-br') {
                            return 'pt_br'
                          } else {
                            return this.$i18n.locale
                          }
                        }
                      },

    methods: {

            functionDicas(dicas) {
                    if (this.$i18n.locale == 'pt-br') {
                      return dicas.nome
                    } else if (this.$i18n.locale == 'en') {
                      return dicas.nome_en
                    } else if (this.$i18n.locale == 'es') {
                      return dicas.nome_es
                    }
                  },

            
            start () {
               this.loading = true
                    },

            finish () {
              this.loading = false
                    },                    
                    }     
  }
</script>

CodePudding user response：

You're overcomplicating this and trying to do something that is way easier by using the following: nuxt-i18n

Essentially, you create a json or javascript file with your translations. Those translations are marked by a key, and then that key is what you call in your components.

Read the link and it should make more sense!