[Vuejs]-VueJS Translate Plugin

by

0👍

Don’t use arrow function to return your data and use locale property instead of text:

new Vue({
  el: "#app",
  data() {
    return {
      message: this.$translate.locale['hello-world']
    }
  },
  beforeCreate() {
    this.$translate.setLang('pt_BR')
  },
  locales: {
    pt_BR: {
      'hello-world': 'Olá mundo'
    }
  }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue-translate-plugin@1.2.0/dist/vue-translate.common.min.js"></script>
<div id="app">
  <p> {{ message }} </p>
</div>
👤Sovalina

0👍

I only needed to use this.t('message') like:

<script>

export default {
    data {
        return {
            message: this.t('message')
        }
    }
}

</script>
👤Leonardo Santos

0👍

It should be corrected like this with ‘$’,

export default {
data {
    return {
        message: this.$t('message')
    }
}

}

👤kusan

Leave a comment