How do I translate Quasar component?

  • I have a Vue/Quasar application in which I use i18n but now I’m facing a problem: table footer doesn’t get translated. In the table headers, for example, I do something like this to translate column names:

      align: 'left',
      field: (val) => val,
      label: this.$t('locale.column'),
      name: 'column',
      required: true,
      sortable: true,

    where $t is 18n function, locale is my component and the column is actually’s column’s name. I don’t have direct access to the footer of the table (where the pagination an the total number of the elements are) and it doesn’t get translated. I also use Quasar language packs, quasar.js goes like this:

    import en from 'quasar/lang/en-us.js'
      import other languages
    import {
    } from '@state/modules/i18n';
    const locale = state.locale;
    const langDictionary = {
      // all the imported langs go here
    Vue.use(Quasar, {
      config: {},
      components: { /* not needed if importStrategy is not 'manual' */ },
      directives: { /* not needed if importStrategy is not 'manual' */ },
      plugins: {
      lang: langDictionary[locale]
    export {langDictionary}; 

    How do I translate the table footer?

Log in to reply